flex chart中文旋转

 

<mx:horizontalAxisRenderer>             <mx:AxisRenderer labelRotation="-45" /> </mx:horizontalAxisRenderer> 

    将X轴的标注转转成45度，但是设置这个要使中文旋转的话，必须要设置一下字体才生效，要不然没有效果。

设置步骤如下：

1. 设置字体（从window系统中找到 字体 STSONG.TTF或者FZYTK.TTF 放入项目中）

设置宋体：

<fx:Style>@font-face {src: url("asssets/STSONG.TTF"); font-family: EmbeddedArial;embedAsCFF: false;}.columnChart{font-family: EmbeddedArial;fontSize: 12px; fontWeight:"normal"; }</fx:Style> 

  或者设置成方正姚体

@font-face {src: url("asssets/FZYTK.TTF");font-family: myMyriad;embedAsCFF: false;}.columnChart{font-family: myMyriad;fontSize: 12px; }

2. 完整的应用程序的代码如下

<?xml version="1.0" encoding="utf-8"?><s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"    xmlns:s="library://ns.adobe.com/flex/spark"    xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"><s:layout><s:HorizontalLayout/></s:layout><fx:Declarations><mx:WipeUp id="myWipUp" duration="{duration}" /></fx:Declarations><fx:Style>@font-face {src: url("asssets/STSONG.TTF");font-family: EmbeddedArial;embedAsCFF: false;}.columnChart{font-family: EmbeddedArial;fontSize: 12px; fontWeight:"normal"; }</fx:Style> <fx:Script><![CDATA[import mx.collections.ArrayCollection;import mx.graphics.Stroke;import mx.charts.renderers.CircleItemRenderer;import mx.graphics.Stroke;[Bindable]private var duration:int = 1000;[Bindable]private var medalsAC:ArrayCollection = new ArrayCollection( [{ Station: "站点站点站点station1", up: 35, down:39 },{ Station: "站点站点站点Station2", up: 32, down:17},{ Station: "站点站点站点Station3", up: 27, down:27},{ Station: "站点站点站点Station4", up: 27, down:27},{ Station: "站点站点站点Station5", up: 27, down:27},{ Station: "站点站点站点Station6", up: 27, down:27},{ Station: "站点站点站点Station7", up: 27, down:27},{ Station: "站点站点站点Station8", up: 27, down:27},{ Station: "站点站点站点Station9", up: 27, down:27},{ Station: "站点站点站点Station10", up: 27, down:27},{ Station: "站点站点站点Station11", up: 27, down:27},{ Station: "站点站点站点Station12", up: 27, down:27},]);]]></fx:Script><s:Panel title="线路分段评价" width="100%" height="100%"><s:VGroup width="100%" height="100%" textAlign="center" horizontalAlign="center"><mx:Label fontSize="16" text="线路分段评价" textAlign="center"/><mx:Legend dataProvider="{colChar}" textAlign="center" direction="horizontal"/><mx:ColumnChart styleName="columnChart" id="colChar" width="100%" height="100%" paddingLeft="5" paddingRight="5" showDataTips="true" dataProvider="{medalsAC}" columnWidthRatio="0.3" maxColumnWidth="50" showLabelVertically="true" selectionMode="single"><mx:horizontalAxis><mx:CategoryAxis categoryField="Station" title="城市" /></mx:horizontalAxis><mx:horizontalAxisRenderer><mx:AxisRenderer labelRotation="45" /></mx:horizontalAxisRenderer><mx:verticalAxis><mx:LinearAxis title="数据量"/></mx:verticalAxis><mx:backgroundElements><mx:GridLines horizontalStroke="{new Stroke(0xADD8E6,0)}"/></mx:backgroundElements><mx:series><mx:ColumnSeries yField="up" displayName="上行"  labelPosition="outside" creationCompleteEffect="{myWipUp}"/><mx:ColumnSeries yField="down" displayName="下行"   labelPosition="outside" creationCompleteEffect="{myWipUp}"/></mx:series></mx:ColumnChart></s:VGroup></s:Panel></s:Application>

3.旋转成功，展示图