-
1. Re: Flex charts: How to hide axis lines with CSS?
Kanchan Ladwani Oct 25, 2011 6:09 AM (in response to dwaynie)Hey,
plz check out these links ,
http://www.flexdeveloper.eu/forums/flex-charting/how-do-i-remove-the-axis-and-gridlines/
http://livedocs.adobe.com/flex/3/html/help.html?content=charts_formatting_05.html
Thanks and Regards,
---------------------------------------------------------------------- ----------------------------
Kanchan Ladwani | kladwani@infocepts.com | www.infocepts.com
---------------------------------------------------------------------- ----------------------------
-
2. Re: Flex charts: How to hide axis lines with CSS?
dwaynie Oct 25, 2011 6:50 AM (in response to Kanchan Ladwani)Hello!
Unfortunately the CSS in that flexdeveloper.eu link doesn't work.
<mx:Style> @namespace mx "library://ns.adobe.com/flex/mx"; ... .horizontalAxis { showLine: false; } .verticalAxis { showLine: false; } </mx:Style> ... <mx:horizontalAxisRenderers> <mx:AxisRenderer id="horizontalAxis" axis="{someName.horizontalAxis}" /> </mx:horizontalAxisRenderers> <mx:verticalAxisRenderers> <mx:AxisRenderer id="verticalAxis" axis="{someName.verticalAxis}" /> </mx:verticalAxisRenderers>And the livedocs.adobe.com one is the one I'm already using.
Thanks!
--Dwayne
-
3. Re: Flex charts: How to hide axis lines with CSS?
dwaynie Oct 25, 2011 7:01 AM (in response to dwaynie)Plus, according to the link below, shouldn't my top CSS example work?
Adobe Flex 4.5 > Applying chart styles > Using predefined axis style properties
My code can be found here:
https://gist.github.com/70738199a30c2fa210db
--Dwayne
-
4. Re: Flex charts: How to hide axis lines with CSS?
Fletchgqc Oct 26, 2011 5:24 AM (in response to dwaynie)Regarding the data binding warnings, see if you can get away without specifying the axis. Not sure if that will work. Otherwise, give the axis an id like the example at the bottom of http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/charts/AxisRenderer. html#axis.
The doco for showLine says "Specifies whether to display the axis. The default value is true." I think it's referring to the line at the bottom of the axis, next to the numbers. It's nothing to do with the grid lines. Which explains why your code doesn't work.
If you are not using gridlines at all (= not using the lines, not using horizontal-fill and horizontal-alternate-fill etc), then I think you can just get rid of them by specifying an empty array. Either in actionscript or in your chart tag (<mx:ColumnChart id="highlights" dataProvider="{results.result}" showDataTips="true">) add the argument: backgroundElements = "[]".
If this is not desireable, go to plan b:
You can control gridlines via css like this:
mx|GridLines {
gridDirection: both; // horizontal or vertical also accepted, but not "none".
}
If you want none... well I've got some code where I do this:
(backgroundElements[0] as GridLines).setStyle("gridDirection", "horizontal");
// One of the arguments is the alpha, i.e. alpha=0 (translucent)
var stroke:SolidColorStroke = new SolidColorStroke(0, 0, 0);
(backgroundElements[0] as GridLines).setStyle("horizontalStroke", stroke);
... and that definitely works.
-
5. Re: Flex charts: How to hide axis lines with CSS?
dwaynie Oct 26, 2011 7:35 AM (in response to Fletchgqc)Hey man!
Maybe there's some confusion here - I'm talking about the X and Y axis lines, not the grid lines though.
But, I've already disabled grid lines with this code:
<mx:backgroundElements> <fx:Array /> </mx:backgroundElements>
Unfortunately, adding IDs to the disablement of my axis lines:
<mx:horizontalAxisRenderers> <mx:AxisRenderer id="horizontalAxis" axis="{chart.horizontalAxis}" showLine="false" /> </mx:horizontalAxisRenderers> <mx:verticalAxisRenderers> <mx:AxisRenderer id="verticalAxis" axis="{chart.verticalAxis}" showLine="false" /> </mx:verticalAxisRenderers>will not get rid of the warnings.
--Dwayne
-
6. Re: Flex charts: How to hide axis lines with CSS?
Fletchgqc Oct 27, 2011 2:10 AM (in response to dwaynie)Ahh sorry.
Did you try mimicking the code at the bottom of
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/ charts/AxisRenderer.html#axis? I'm pretty sure that will get rid of the warnings.

