Flex3 Linechart points are too close to the edge

Question

I have a Flex3 LineChart component using an CircleItemRenderer and the datapoints are being cut off because they are too close to the edge. Here's what it looks like:

http://img29.imageshack.us/img29/3850/chartx.png

As you can see, the circles on the left and right sides are being cut off.

How can I make the LineSeries area, plus the horizontal labels, narrower so it fits in the chart area?

Thanks!

Answer 1

You might want to set the maximum and minimum values in your LinearAxis in the horizontalAxis object. Check the API for more information: http://livedocs.adobe.com/flex/3/langref/mx/charts/LinearAxis.html

The Line Chart determines automatically these values to fill all the elements in the screen. You might want to change these values so the graph has some space at the sides.

Answer 2

You can set the padding property on the horizontalAxis and verticalAxis child objects as well...

Answer 3

Can you give me the code sample of using the maximum /minimum or padding property

Notes about LinearAxis padding property " This is useful for chart types that render beyond the bounds of the category, such as columns and bars. However, when used as the horizontalAxis in a LineChart or AreaChart, it is reset to 0."

I am using the CategoryAxis as the horizontalAxis in Linechart. How can i set the padding property reset in this case?

Answer 4

Adjust the mask on the chart component.

Answer 5

I had the same issue and was able to resolve it by setting the clipContent attribute in the chart tag to false. I found this solution on Amy's Flex Diary.

Answer 6

I got d solution.

1. create 'creationComplete' event in LineChart

2. edit horizontalAxis's padding you want

   e.target.horizontalAxis.padding = 0.2;