Monday, October 3, 2011

Flex 3 Line Charts with Datapoints always displayed

I was tasked today with making the datapoints on a line chart always show up instead of just on hover.  I knew it could be done but nothing seems to be built in for this and you can spend a lot of time searching around to get this to work so I’m going to make it easy for you.

FYI If you use showAllDataTips="true" this will create a mess is not what you’re probably looking for.  So few things to note.  First in your series, you need to use an itemRenderer.  They come will the charting so they should be available for you.

mySeries.setStyle("itemRenderer", new ClassFactory(CircleItemRenderer));


<mx:LineSeries itemRenderer="mx.charts.renderers.CircleItemRenderer"/>

Now if you are specifying your own colors, you need to not only set your strokes and colors but in order to have your colors of your CircleItemRenderers match your strokes, you need to make sure and set the Fill to that same color.

mySeries.setStyle( "fill", myColor);

The last thing to note here is on your chart to set clipContent="false" so that your datapoints or CircleItemRenderers don’t get cut off on the edges.
Hope this helps!

No comments:

Post a Comment