Flex4(Flash Builder 4)如何旋转图表横纵坐标的label

代码如下:
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";

[color=red] @font-face {
src:url("assets/font/arial.ttf");
font-family: EmbeddedArial;
embedAsCFF:false;
}

mx|LineChart {
fontFamily: EmbeddedArial;
fontSize: 12px;
}[/color]
</fx:Style>

<mx:horizontalAxisRenderers>
<mx:AxisRenderer axis="{ca}" [color=red]labelRotation="-45"[/color] canDropLabels="true" axisStroke="{axis}" placement="bottom" tickLength="5" tickPlacement="outside" minorTickLength="2" minorTickPlacement="inside" labelGap="0" >
<mx:tickStroke>{ticks}</mx:tickStroke>
<mx:minorTickStroke>{mticks}</mx:minorTickStroke>
</mx:AxisRenderer>
</mx:horizontalAxisRenderers>

注意网上常见的
@font-face {
src: local("Arial");
font-family: EmbeddedArial;
}
local("Arial")在Flash Builder4中的写法是错误的,俺也不知道怎样才能方便快捷引用系统的字体,模仿官方例子,把系统目录C:\WINDOWS\Fonts下的arial.ttf拷贝了一份放到项目的assets/font/下。

贴上官方的例子供大家参考:

Rotating chart axis labels

<?xml version="1.0"?>
<!-- charts/RotateAxisLabels.mxml -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark"
creationComplete="srv.send()"
height="600">

<fx:Declarations>
<!-- View source of the following page to see the structure of the data that Flex uses in this example. -->
<mx:HTTPService id="srv" url="http://aspexamples.adobe.com/chart_examples/expenses-xml.aspx"/>
<!-- To see data in an HTML table, go to http://aspexamples.adobe.com/chart_examples/expenses.aspx -->
</fx:Declarations>

<fx:Style>
@namespace mx "library://ns.adobe.com/flex/mx";

@font-face{
src: url("../assets/MyriadWebPro.ttf");
fontFamily: myMyriad;
embedAsCFF: false;
}

mx|ColumnChart {
fontFamily: myMyriad;
fontSize: 20;
}
</fx:Style>

<s:layout>
<s:VerticalLayout/>
</s:layout>

<s:Panel title="Rotated Axis Labels">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<mx:ColumnChart id="column"
dataProvider="{srv.lastResult.data.result}"
showDataTips="true">
<mx:horizontalAxis>
<mx:CategoryAxis id="a1"
categoryField="month"
title="FY 2010"/>
</mx:horizontalAxis>

<mx:verticalAxis>
<mx:LinearAxis id="a2"/>
</mx:verticalAxis>

<mx:horizontalAxisRenderers>
<mx:AxisRenderer labelRotation="-90" axis="{a1}"/>
</mx:horizontalAxisRenderers>

<mx:verticalAxisRenderers>
<mx:AxisRenderer labelRotation="45" axis="{a2}"/>
</mx:verticalAxisRenderers>

<mx:series>
<mx:ColumnSeries displayName="Profit"
xField="month"
yField="profit"/>
<mx:ColumnSeries displayName="Expenses"
xField="month"
yField="expenses"/>
</mx:series>
</mx:ColumnChart>
<mx:Legend dataProvider="{column}"/>
</s:Panel>
</s:Application>

http://help.adobe.com/zh_CN/flex/using/WS2db454920e96a9e51e63e3d11c0bf65816-7fe5.html
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值