Pie Chart Radial Wipe

Question

Hi all,
I'm trying to figure out the best way to do this:
- I have a pie chart with five equal slices.- I'd like for the user to be able to mouse over each slice and for the slice to then wipe radially to fill the whole chart.In my slide example, you'll see that I've accomplished what I'm describing in the top right slice by simply using a wheel animation. However, this only works because the wheel starts at 12:00. The start point can't be changed, apparently, (https://community.articulate.com/discussions/articulate-storyline/wheel-animation-storyline-2 - I've submitted a feature request) so I'm trying to figure out a work around: how to create this feature (or similar! I'm open to outside-the-wheel ideas... the pie slice could expand from both sides at once, for example) so that any of the five slices and expand to fill the whole circle.Thanks in advance!

walthamilton · Answer

Your example didn't make it. You can attach something only by using a browser and the Add Attachment button. Phones don't send the file, only a link, which the system can't handle.

rachelhedgepeth · Answer

Thanks, Walt! Trying again here.

walthamilton · Answer

Maybe something like this would work. It would probably work better with layers.

nathan_hilliard · Answer

Here is an option close to what you were looking for. It uses an animated shape border to "wipe" in the solid shape when you click on a pie segment. It uses a little JavaScript to adjust shapes&nbsp; already on the slide. The scripts could be cleaned up/combined.
Expanded from an idea here:
https://stackoverflow.com/questions/33778835/radial-wipe-with-pure-css-if-not-svg-alternative
Try it:
https://360.articulate.com/review/content/c721b423-ce69-40b1-b218-3b330daa8536/review

nedimramic-88da · Answer

This is the closest I can get using Storyline alone, combining pie shapes, states, and state changes based on timing. It simulates a wheel animation that can be sped up or slowed down. Each layer has a faded oval to cover imperfections. Please check out my video demonstrating this interaction.

Forum Discussion

Pie Chart Radial Wipe

Related Content

Pie chart percentages

Using Charts in your Storyline

RISE 360 chart value label issues

Radar chart for self assessment

Radial buttons cannot be selected by end user

Pie Chart size

Radial Buttons

Create a pie chart with four slices

Pie Chart Values

Organizational chart in Rise

Recent Discussions

Editing existing Rise scorm to update course in LMS - not working as expected

Audio file adds silence once track is done?

Flashcard deck that allows learner to retest things they've gotten wrong

Text not appearing in shape

Reach 360 Publishing updates