flex LineChart和ColumnChart横坐标的标签纵向显示

重点说明:
1.要实现LineChart、ColumnChart横坐标纵向显示,首先要在flex的主应用程序(<mx:Application></mx:Application>)里定义样式:
    <mx:Style>
        @font-face{
    src:local("Arial");
    fontFamily:ArialEmbedded;//字体别名
        }
   </mx:Style>
2.在图形界面定义样式:
    <mx:Style>
        .myChart{
            fontFamily:ArialEmbedded;
}
    </mx:Style>

折线图:styleName与定义的样式相对应
    <mx:LineChart id="lineChart" height="100%" width="100%" styleName="myChart">
        <mx:horizontalAxis>
            <mx:CategoryAxis id="categoryAxis" categoryField="name"/>
        </mx:horizontalAxis>
        <!--labelRotation此属性为纵坐标旋转的角度-->
        <mx:horizontalAxisRenderers>
            <mx:AxisRenderer labelRotation="90" axis="{categoryAxis}"/>
        </mx:horizontalAxisRenderers>
    </mx:LineChart>
    注意:1.主应用程序里定义的font-family和折线图里定义的font-family一定要一致,否则横坐标值仍然不能纵向显示。
    2.两个样式也可以直接都设置在图形的程序里面。
    3.如果在跟要纵坐标纵向显示的相关的程序,不应有fontWeight="bold"属性,否则也将不会实现纵向显示。
    4.我所用的是flex3,如果你用的是flex4的话:
    <mx:Style>
        @font-face{
    src:local("Arial");
    fontFamily:ArialEmbedded;//字体别名
        }
   </mx:Style>中的local("");改为用url("");

你可能感兴趣的:(flex LineChart和ColumnChart横坐标的标签纵向显示)