[英]Flex ColumnSeries CSS fills not being applied
I'm trying to set the fill colour of the series in a Flex (v4.6) ColumnChart using CSS. 我正在尝试使用CSS在Flex(v4.6)ColumnChart中设置系列的填充色。 I'm currently using setStyle as I've also set the alpha value, but I understand that this is quite resource intensive so I'm thinking of not setting the alpha and just setting the colour using CSS.
我目前正在使用setStyle,因为我还设置了alpha值,但是我知道这会占用大量资源,因此我考虑不设置alpha而是仅使用CSS设置颜色。 However, I can't get it to work using a CSS declaration something like:
但是,我无法通过CSS声明使它正常工作:
mx|ColumnSeries {
fills: #FFCC33, #FF0033, #FF3333, #FF6633, #FF9933;
It works fine if I define the following styles: 如果定义以下样式,则效果很好:
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
.anotherColour { fill: #CCFFB3; }
.andAnotherColour { fill: #BBFF99; }
</fx:Style>
and apply as follows: 并申请如下:
<mx:ColumnSeries
xField="Month"
yField="Profit"
displayName="Profit"
styleName="anotherColour"
/>
<mx:ColumnSeries
xField="Month"
yField="Expenses"
displayName="Expenses"
styleName="andAnotherColour"
/>
Can anybody help please? 有人可以帮忙吗?
Thanks. 谢谢。 Dan.
担。
Full code example that doesn't work: 完整的代码示例不起作用:
<?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">
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
mx|ColumnSeries {
fills: #CCFFB3, #BBFF99;
}
</fx:Style>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
public var expenses:ArrayCollection = new ArrayCollection([
{Month:"Jan", Profit:2000, Expenses:1500},
{Month:"Feb", Profit:1000, Expenses:200},
{Month:"Mar", Profit:1500, Expenses:500}
]);]]>
</fx:Script>
<mx:Panel title="Column Chart">
<mx:ColumnChart id="myChart" dataProvider="{expenses}" showDataTips="true">
<mx:horizontalAxis>
<mx:CategoryAxis
dataProvider="{expenses}"
categoryField="Month"
/>
</mx:horizontalAxis>
<mx:series>
<mx:ColumnSeries
xField="Month"
yField="Profit"
displayName="Profit"
/>
<mx:ColumnSeries
xField="Month"
yField="Expenses"
displayName="Expenses"
/>
</mx:series>
</mx:ColumnChart>
<mx:Legend dataProvider="{myChart}"/>
</mx:Panel>
</s:Application>
mx|ColumnSeries
{
fills: #FFCC33,#FF0033,#FF3333,#FF6633,#FF9933;
}
try this, it should work 试试这个,它应该工作
Try this: 尝试这个:
mx|ColumnSeries {
fills: [0xFFCC33,0xFF0033,0xFF3333,0xFF6633,0xFF9933];
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.