Javascript 在谷歌图表中填充一种颜色
我们正在尝试在谷歌面积图中只填充一种颜色,使用不同的线颜色 如果我们使用Javascript 在谷歌图表中填充一种颜色,javascript,charts,google-visualization,Javascript,Charts,Google Visualization,我们正在尝试在谷歌面积图中只填充一种颜色,使用不同的线颜色 如果我们使用 isStacked:true 然后它将更改图表表示形式 (更改y轴最大坐标) 我们只想填充一种颜色 (图表中最大边框下方的绿色) 你的意思是这样:还是这样 您可以将areaOpacity设置为零,以删除序列的填充。 第一个和第二个jsiddle链接之间的差异是isstacked值 series: { 0: { areaOpacity: 0 }
isStacked:true
然后它将更改图表表示形式(更改y轴最大坐标) 我们只想填充一种颜色
(图表中最大边框下方的绿色) 你的意思是这样:还是这样 您可以将
areaOpacity
设置为零,以删除序列的填充。
第一个和第二个jsiddle链接之间的差异是isstacked
值
series: {
0: {
areaOpacity: 0
}
},
要使两个区域的颜色“相同”,但线条的颜色不同,您需要添加一个虚拟列,如下所示:使用a和两组相同的数据,我相信我能够达到预期的结果
请注意每个系列的定义
使用areaOpacity:1
防止颜色混合,前两个是相同的
这些也不是可见的登录
google.charts.load('current',{'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
函数绘图图(){
var data1=google.visualization.arrayToDataTable([
[“年度”、“销售”、“费用”、“费用”、“销售”],
['2013', 1000, 400, 400, 1000 ],
['2014', 1170, 460, 460, 1170 ],
['2015', 660, 1120, 1120, 660 ],
['2016', 1030, 540, 540, 1030 ]
]);
var data2=google.visualization.arrayToDataTable([
[“年度”、“销售”、“费用”、“费用”、“销售”],
['2013', 1000, 400, 400, 1000 ],
['2014', 1170, 460, 460, 1170 ],
['2015', 660, 400, 400, 660 ],
['2016', 1030, 540, 540, 1030 ]
]);
var data3=google.visualization.arrayToDataTable([
[“年度”、“销售”、“费用”、“费用”、“销售”],
['2013', 400, 1000, 1000, 400 ],
['2014', 460, 1170, 1170, 460 ],
['2015', 400, 660, 660, 400 ],
['2016', 540, 1030, 1030, 540 ]
]);
变量选项={
标题:“公司业绩”,
哈克斯:{
标题:"年",,
titleTextStyle:{
颜色:“#333”
}
},
言辞:{
最小值:0
},
系列:{
0: {
面积不透明度:1,
颜色:“#EF9A9A”,
类型:'区域',
visibleInLegend:false
},
1: {
面积不透明度:1,
颜色:“#EF9A9A”,
类型:'区域',
visibleInLegend:false
},
2: {
颜色:“#5C6BC0”,
线宽:5,
类型:“行”
},
3: {
颜色:“#B71C1C”,
线宽:5,
类型:“行”
}
}
};
var chart=new google.visualization.ComboChart(document.getElementById('chart_div1'));
图表绘制(数据1,选项);
var chart=new google.visualization.ComboChart(document.getElementById('chart_div2'));
图表绘制(数据2,选项);
var chart=new google.visualization.ComboChart(document.getElementById('chart_div3'));
图表绘制(数据3,选项);
}
不,我们希望在蓝线下方也有相同的红色。这可以通过折线图实现吗?谢谢。近似但相同的颜色相互重叠,意味着蓝线以下的红色混合,我们不想混合。是的,我担心:P,这是我能做到的,也许其他人有更多的技巧:)。是的,这是我想要的,但当两条线不相交时,它失败了。怎么会这样?见编辑,我添加了两个额外的图表来理解,但似乎在这里工作。。。?