Flex charts: How to hide axis lines with CSS?

Question

Hello!
How do I hide my axis lines with CSS? Shouldn't this work?
<mx:Style>
  @namespace mx "library://ns.adobe.com/flex/mx";
  mx|ColumnChart {
    horizontalAxisStyleName: myAxisStyles;
    verticalAxisStyleName: myAxisStyles;
  .myAxisStyles { showLine: false; }
</mx:Style>
I also tried display: none.
Prior to this I used:
<mx:horizontalAxisRenderers>
  <mx:AxisRenderer showLine="false" axis="{someName.horizontalAxis}" />
</mx:horizontalAxisRenderers>
<mx:verticalAxisRenderers>
  <mx:AxisRenderer showLine="false" axis="{someName.verticalAxis}" />
</mx:verticalAxisRenderers>
But it produced some annoying warnings:
Data binding will not be able to detect assignments to "horizontalAxis".
Data binding will not be able to detect assignments to "verticalAxis".
Thanks!
--Dwayne

Answer 1

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.