JavaScript Motion Chart Bubble Trail

VIEW MORE CHARTS
SAVE
VIEW HTML
EDIT ON CODEPEN
A motion chart represents data with the moving effect of the data change from the first data to the last data. To create a motion chart using KoolChart's JavaScript charting library, the <MotionChart> element and one of the three series (Motion Bubble Chart: <MotionBubbleSeries>, Motion Column Chart: <MotionColumnSeries>, Motion Line Chart: <MotionLineSeries>) elements must be set in Layout.

In this JavaScript chart example, a <MotionBubbleSeries> element is defined within a <MotionChart> element in order to create a motion bubble chart.
<MotionChart showDataTips="true" >
...
<series>
<MotionBubbleSeries yField="Data1" radiusField="Data2" ... >
...
</MotionBubbleSeries>
</series>
</MotionChart>