根据CF图中的数据设置条形条颜色



我正在CF11中创建一个条形图。是否可以根据数据为CFchartseries中的不同条形图提供不同的颜色?

<cfchartseries serieslabel="Rent" type="bar" colorlist="barcolr_list">
        <cfloop index="counter" from=1 to="#ArrayLen(PropName_arry)-1#" step="1">               
        <cfchartdata item="#PropName_arry[counter]#" value="#Grossrent_arry[counter]#" >        
    </cfloop>
</cfchartseries>

我在文档中读到colorlist属性可用于饼,金字塔…等图。如何根据当前值

为栏设置不同的颜色?

即,如果粗值> 800条颜色应为红色否则应该是蓝色

ColorList仅适用于图表类型饼,金字塔,面积,水平条,锥形,圆柱体或阶梯。cfchartseries。

你可以用两种不同的方式为每一列创建特定的颜色。通过规则或样式列表。

您可以创建一个添加到plot属性的规则。指定适用于该规则的颜色。下面的例子显示了x轴值为true时的规则。

<cfset plot= {"rules": [
    {"rule":"'%k'=='2007'",
     "background-color":"purple"},
    {"rule":"'%k'=='2008'",
     "background-color":"pink"},
    {"rule":"'%k'=='2009'",
     "background-color":"green"}]}
    >

或者您可以使用plot中的styles属性为图表创建一个样式列表。

<cfset plot = {"styles":[
{
"background-color":"##e95d22"
},
{
"background-color":"##017890"
},
{
"background-color":"##da534d"
},
{
"background-color":"##4a266d"
},
{
"background-color":"##f4913c"
}]}>

像这样在图表元素中包含plot变量。

<cfchart format="png" chartheight="180" chartwidth="233" showlegend="false" style="test.js" plot="#plot#">
<cfchartseries type="bar">
    <cfchartdata item="2005" value="1000"/>
    <cfchartdata item="2006" value="3000"/>
    <cfchartdata item="2007" value="1000"/>
    <cfchartdata item="2008" value="4000"/>
    <cfchartdata item="2009" value="2000"/>
</cfchartseries>

为了帮助我的例子,这里是我的test.js
{
"graphset":[
    {
    "border-width":1, 
    "background-color":"transparent",
    "plotarea":{"margin":"dynamic"}
}]
}

这两种技术都可以通过test.js文件直接包含,但要使这些颜色动态,更容易通过plot属性输入。

相关内容

  • 没有找到相关文章

最新更新