Displaying data points in Flex Line chart

Question

I have a flex line chart. Instead of the default behavior of having to hover over parts of the line to see the data points, is there a way to change the rendering of each point and have them always displayed? (almost like a connect the dots type view).

Answer 1

Try this

<mx:LineChart>
    <mx:series>
        <mx:LineSeries dataProvider="{arr1}">
            <mx:itemRenderer>
                <mx:Component>
                    <mx:CrossItemRenderer/>
                </mx:Component>
            </mx:itemRenderer>
        </mx:LineSeries>
    </mx:series>
</mx:LineChart>

you can change CrossItemRenderer with DiamondItemRenderer or any other
For an example look at the bottom of this page: Using strokes with chart controls

Answer 2

you will need to set the 'showAllDataTips' property of the LineChart to true e.g.

 <mx:LineChart id="linechart" height="100%" width="45%"
        paddingLeft="5" paddingRight="5" 
        showDataTips="true" dataProvider="{expensesAC}"
        showAllDataTips="true">

That will display all of the data tips for that chart

Answer 3

I am constructing the line series using ActionScript and also using line mx:lineStroke in MXML to change the color of the line. The problem is that the CircleItemRenderer I am using with this line does not take the color of the line, instead takes some default color. Is there a way that, say orange triangles shown for a blue line can be changed to blue triangles, and thus being consistent with the line color.

---

Solution:---

<mx:SolidColor id="fillColor" color="0xbbbbbb" alpha="1"/>
<mx:Stroke id="lineStroke" color="0xbbbbbb" weight="2" alpha="1"/>

<mx:series>
  <mx:LineSeries yField="yvalue" xField="xvalue"
                 form="curve" 
                 itemRenderer="mx.charts.renderers.CircleItemRenderer"
                 fill="{fillColor}" 
                 lineStroke="{lineStroke}" stroke="{null}" />
</mx:series>

Answer 4

As posted in response to another question on the same subject...

If you're using <mx:LineSeries>, then set the following property:

itemRenderer="mx.charts.renderers.CircleItemRenderer"

When constructing a LineSeries in ActionScript, then set the itemRenderer style on your LineSeries object before adding to the series array:

lineSeries.setStyle("itemRenderer", new ClassFactory(mx.charts.renderers.CircleItemRenderer));

Don't forget to...

import mx.charts.renderers.*;

You don't have to stick to the circle item renderer either, you can use any of the item renderers found in the renderers package.