Charts coldfusion中堆叠条形图上的直线
我想在这张图表上加两条垂直线Charts coldfusion中堆叠条形图上的直线,charts,coldfusion,Charts,Coldfusion,我想在这张图表上加两条垂直线 <cfchartseries type="line" seriescolor="Red"> <cfloop index="ScoringPercent" array="#ScoringPercents[1]#" > <cfchartdata item="#ScoringPercent#" val
<cfchartseries type="line" seriescolor="Red">
<cfloop index="ScoringPercent" array="#ScoringPercents[1]#" >
<cfchartdata item="#ScoringPercent#" value="74" >
</cfloop>
</cfchartseries>
<cfchartseries type="line" seriescolor="Yellow">
<cfloop index="ScoringPercent" array="#ScoringPercents[1]#" >
<cfchartdata item="#ScoringPercent#" value="53" >
</cfloop>
</cfchartseries
使用堆叠条形图时,添加的每个系列都将显示在彼此上方
因此,红线系列位于条形图上方100点标记上方74点处(Y轴上174点标记处)。类似地,黄线系列位于红线上方,红线上方53点(Y轴上227点标记处)
更新
如果您使用的是ColdFusion版本10或更高版本,您可以这样做。
从ColdFusion版本10开始,ColdFusion使用ZingCharts,允许通过JSON样式文件进行更多定制。
注意:这是您需要用自己的代码替换的示例代码
<cfset arr1 = [10,20,30,40,50] />
<cfset arr2 = [20,10,60,70,30] />
<cfset arr3 = [90,50,40,10,80] />
<cfchart chartwidth="1000" chartheight="750" format="html" style="LineStackedBar.json">
<cfchartseries type="Bar" seriescolor="Green">
<cfloop index="ScoringPercent2" array="#arr1#" >
<cfchartdata item="#ScoringPercent2#" value="#ScoringPercent2#">
</cfloop>
</cfchartseries>
<cfchartseries type="Bar" seriescolor="Yellow">
<cfloop index="ScoringPercent2" array="#arr2#" >
<cfchartdata item="#ScoringPercent2#" value="#ScoringPercent2#">
</cfloop>
</cfchartseries>
<cfchartseries type="Bar" seriescolor="Red">
<cfloop index="ScoringPercent2" array="#arr3#" >
<cfchartdata item="#ScoringPercent2#" value="#ScoringPercent2#">
</cfloop>
</cfchartseries>
<cfchartseries type="line" seriescolor="Red">
<cfloop index="ScoringPercent2" array="#arr3#" >
<cfchartdata item="#ScoringPercent2#" value="74" >
</cfloop>
</cfchartseries>
<cfchartseries type="line" seriescolor="Yellow">
<cfloop index="ScoringPercent2" array="#arr2#" >
<cfchartdata item="#ScoringPercent2#" value="53" >
</cfloop>
</cfchartseries>
</cfchart>
它生成以下输出:
参考@Mike's answer@PatrickSchomburg,我认为这是不可能的,但这个链接可能有助于实现您的目标。如果我切换平台,google charts能做到这一点吗?
{
"graphset":[
{
"legend":{
"position":"30%, 0%",
"border-color":"#CCCCCC",
"background-color":"#FFFFFF",
"margin-top":40,
"layout":"x4",
"shadow":false,
"alpha":1
},
"border-color":"#cccccc",
"tooltip":{
"font-size":11,
"font-color":"#FFFFFF",
"bold":true,
"font-family":"Helvetica",
"padding":5
},
"series":[
{
"hover-state":{
"visible":false
},
"shadow-blur-y":1,
"shadow-color":"#cccccc",
"shadow-alpha":1,
"shadow":true,
"background-color-2":"#FFCF8C",
"background-color":"#735328",
"type":"bar",
"stacked":"true",
"shadow-distance":2,
"shadow-blur-x":2
},
{
"hover-state":{
"visible":false
},
"shadow-blur-y":1,
"shadow-color":"#cccccc",
"shadow-alpha":1,
"shadow":true,
"background-color-2":"#FEFFD1",
"background-color":"#9D9C5D",
"type":"bar",
"stacked":"true",
"shadow-distance":2,
"shadow-blur-x":2
},
{
"hover-state":{
"visible":false
},
"shadow-blur-y":1,
"shadow-color":"#cccccc",
"shadow-alpha":1,
"shadow":true,
"background-color-2":"#FEFFD1",
"background-color":"#9D9C5D",
"type":"bar",
"stacked":"true",
"shadow-distance":2,
"shadow-blur-x":2
},
{
"hover-state":{
"visible":false
},
"line-color":"#699EBF",
"border-color":"#699EBF",
"line-width":3,
"type":"line",
"stacked":"false"
},
{
"hover-state":{
"visible":false
},
"line-color":"#143F59",
"border-color":"#143F59",
"line-width":3,
"type":"line",
"stacked":"false"
}
],
"plotarea":{
"margin-top":80,
"margin-left":70,
"margin-right":30
},
"3d-aspect":{
"true3d":false
},
"background-color":"white",
"border-width":1,
"plot":{
"hover-marker":{
"background-color":"#888888",
"size":3
},
"marker":{
"background-color":"#cccccc",
"size":3
},
"preview":true,
"tooltip-text":"%v"
},
"type":"mixed",
"title":{
"border-width":1,
"border-color":"#cccccc",
"background-color":"white",
"font-size":18,
"bold":true,
"font-family":"Helvetica",
"color":"#333333"
}
}
]
}