SiteOrigin Radial Widget
The SiteOrigin Radial widget provides a simple solution for displaying process and step based data. The radial can be statics, rotated, animated and filled to a defined percent.
Radials should be given a Title and a suitable Title Size in the Data Section of the widget form.
Filling the Track
The Percent option is used to determine the amount the line fills the track of the radial.
Rotating the Line
By default the track is lined from the right of the radial this behaviour can be adjusted with the Rotation option.
Track & Line Color
For easier theme integration the color of the track and line can be set independently using the color option of forms Data Section.
The thickness or width of the line and track can be adjusted with the Width option.
Width of 3
Width of 6
Width of 9
The way the ends of the line are rendered can be adjusted using Line Cap option. Lines can be capped with either round or flat based capping.
The radial lines can be animated as the page scrolls using scrollspy. To animate the lines set the Animate option to Yes and supply a Trigger Distance. The trigger distance is how in view the radial needs to be before it is animated.
Radials can be displayed with icons using the Icon Template and setting an Icon and Icon Color.