Draggable Range with a Close Button
A very common use-case with line and area charts is having some sort of visual indicator to be able to easily see parts of the series going over (or below) some specific value. It is very easy to implement with amCharts’ axis range feature. But we can go one step further and allow the viewer to adjust the indicator value. Try dragging the “Stop loss” indicator box up and down.
Key implementation details
We create an axis range and place a container inside of its bullet to hold our UI elements. Then we add a rounded rectangle, a label, and a close button to the container. Finally, we attach an event handler to the container’s dragged event and update our range position and label value accordingly.
Related tutorials
Demo source