Drag and Drop Line Series Segments

The default drag and drop behavior in Flex 3 Charts drags the itemRenderers used in the Series. However for LineSeries and AreaSeries there need not be an itemRenderer and drag will not happen when there are no itemRenderers.

This example will enable users to drag and drop Line Series Segments in a Line Chart. The idea here is

• Create a new dragproxy for the LineChart which renders the line segments
• In the dragproxy, create the line segments and set the bounds
• Creation of line segments is handled using the instancecache classes

Couple of caveats:

• To choose the series in the dragproxy I have used the series of the item that I get from selectedChartItem, this could be changed to your requirements.
• Also, the by default dragEvent will be dispatched, only when a drag happens on an itemRenderer, this could be overcome by generating the dragEvent in MyLineChart based on the position of the mouse

Here is the screenshot of the drag and drop in Action:

Here is the source:

Line.mxml

MyLineChart.as

MyLineSeries.as

MyChartItemDragProxy.as

Hopefully you can drag and drop LineSeries which provides a better effect than just dragging the itemRenderers, I think the same concept could be applied to Area Series as well.

About these ads