Update 1.84.0
Circles around markers + animation options
This update provides a way to draw circles around markers to outline any given radius in a specified metric. The circles include a bunch of options, and they can be animated as shown below. Although, due to the nature of the animation, I don’t recommend enabling it on a large list of markers. These animated GIFS don’t really do the animations any favours but if you go to the demo site and try it, you’ll notice it’s a lot smoother.
Within the 2 marker actions are a bunch of new options. For documentation purposes, I’ve outlined these options below which are for the Set marker action. There’s a similar set inside the Set list of markers action also where the presence of a Radius field in whatever table you define as the dataset will replace the “Draw circle” option.
This section allows for a circle to be drawn around the marker and styling applied. The circle can be used to indicate X distance radius of the marker’s location. If the marker has the draggable option set to true, then the circle will move with the marker as it is dragged. Note: There is an option in the main element’s settings called ‘Dynamic radius’ that is designed for this functionality only. If that field changes dynamically then so will the circle’s radius seen on the map. This currently applies to all markers with the circle showing.
-Draw circle
When set to Yes, a circle will be drawn around the marker using the properties below.
-Units
Select the unit to measure the length calculations in.
-Animate circle
When setting this to Yes, the circle will pulsate in and out. Some of the options below will control the speed, fade etc.
-Animate iterations
This value is in milliseconds and the lower the number, the faster the iterations will be to change the size. This effectively makes the animation smoother but can degrade speed the larger the circles are.
-Animate speed
Speed at which the animation occurs at. Depending on the radius of the circle, this value may need to be increased as it can be quite resource intensive when animating large circles. You can leave this field empty and a value will be auto calculated based upon the radius, although you may want to adjust that. The calculation is formed by (radius / 200) to give an adequate speed in relation to the size of the circle. The higher the number, the faster the animation will be.
-Animate opacity
When this value is set to Yes, the circle's opacity will gradually decrease as the circle gets smaller in size. Setting this to No, will make no changes to the opacity.
-Reverse opacity
When the animation opacity above is set to Yes, the fill color will become more transparent as the circle decreases in size. This option will reverse this behaviour making the fill color more transparent as the circle increases in size.
-Animate min distance
When the circle animates, this is the minimum distance for which the circle will decrease in size to in the units specified. If you leave this field blank, it will calculate a 50% decrease using the given radius.
-Show circle when
Accepted values are: 'increasing', 'decreasing' and 'both'. When the circle is animating, you can use these options to show the circle either when it's increasing in size only, or decreasing in size only, or both. This can give a better pulsate effect.
-Radius
Enter a value for the radius of the circle, this will be measured using the selected units' option above.
-Fill color
Fill color for the circle.
-Stroke weight
Stroke weight (border thickness) for the circle in pixels.
-Stroke color
Stroke color for the circle, this is the border.
-Stroke weight (select)
When the circle is selected, the stroke weight (border thickness) can be specified here.
-Stroke color (select)
When the circle is selected, the stroke weight color (border color) can be specified here.
-Editable
Make the circle editable.
-Enable second circle
When set to Yes, will enable a second circle that you can use. Animation controls do not apply to this.
-Fill color (sec)
Fill color for the second circle.
-Stroke weight (sec)
Stroke weight (border thickness) for the second circle in pixels.
-Stroke color (sec)
Stroke color for the second circle, this is the border.
Within the main map element options are also 2 new options.
Paul