I want to know how to make vary color bar for two series in Jqplot. If I have only one series data, it works perfectly like the image below
我想知道如何在Jqplot中制作两个系列的不同颜色条。如果我只有一个系列的数据,它就像下面的图像一样工作。
The red and green color based on its value.
红色和绿色是基于它的值。
But if I have two series data, I can't configure to have two series color for each series data. So far, I can only make this graph
但是如果我有两个系列数据,我不能为每个系列数据配置两个系列颜色。到目前为止,我只能画出这个图
I want the two series graph can have vary color based on its value as well as the one series graph.
我希望这两个级数图可以有不同的颜色根据它的值和一个级数图。
This is my code
这是我的代码
chart = $.jqplot('map-chart', [dataChart, dataChart2], {
title: 'TIME',
legend: {
renderer: $.jqplot.EnhancedLegendRenderer,
show: true,
location: 'ne'
},
series: [{label: 'Current data'}, {label: 'Worst data'}],
//seriesColors: seriesColors1,
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
pointLabels: {show: true}
//rendererOptions:{
//varyBarColor: true
//}
},
axes: {
xaxis: {
label: 'station',
renderer: $.jqplot.CategoryAxisRenderer,
labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
ticks: tickers,
tickOptions: {
angle: -30
}
},
yaxis: {
min: 0,
label: 'Time',
labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
tickOptions: {
fontSize: '8pt'
}
}
},
highlighter: {show: false}
});
I have tried seriesColors : [seriesColors1, seriesColors2]
but it didn't work.
我尝试过seriesColors: [seriesColors1, seriesColors2]但它不起作用。
2 个解决方案
#1
9
Basically you need to create a series array, that contains a dictionary per entry, with a seriesColors
entry. A working example is shown in the following jsfiddle:
基本上,您需要创建一个系列数组,每个条目包含一个字典,其中包含一个seriesColors条目。下面是一个工作示例:
plot1 = $.jqplot('chart1', [[50,100,50,50,75],[80,70,50,50,40]],
{
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
rendererOptions:{ varyBarColor : true }
},
series: [
{seriesColors: [ "#f00", "#4b0", "#b40", '#ff0', '#fb0']},
{seriesColors: ["#a30", "#4b0", "#b40", '#af0', '#fa0']}
],
highlighter: { show: false }
});
(The fiddle may stop working if I the external js files are changed; jsfiddle doesn't have jqplot libraries by default.)
(如果我改变了外部js文件,提琴可能会停止工作;jsfiddle默认没有jqplot库。
#2
0
I came across this today and as dr jimbob had predicted, all the external files had succumbed to link rot. I found a CDN site and updated the fiddle to the latest jQuery & JQPlot resource files, available here: http://jsfiddle.net/delliottg/WLbGt/96/
我今天遇到了这个问题,正如jimbob博士预测的那样,所有的外部文件都被链接到了rot,我找到了一个CDN站点,并将fiddle更新为最新的jQuery和JQPlot资源文件,可以在这里找到:http://jsfiddle.net/delliottg/WLbGt/96/
Just to satisfy the JSFiddle cop on SO that won't let me post this w/o it:
为了让JSFiddle cop满意,这样就不会让我发布这个w/o:
//this is not my code, it's only here to satisfy the SO require that fiddles have
// code associated with them
plot1 = $.jqplot('chart1', [[50,100,50,50,75],[80,70,50,50,40]], {
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
rendererOptions:{ varyBarColor : true }
},
series: [
{seriesColors: [ "#f00", "#4b0", "#b40", '#ff0', '#fb0']},
{seriesColors: ["#00f", "#b0b", "#a30", "#4b0", '#af0']}
],
highlighter: { show: false }
});
I had nothing to do with the fiddle itself, I just updated it so it worked. Hope this helps someone (turns out it wasn't what I was looking for, but ya pays yer money & ya takes your chances).
我和小提琴本身没有任何关系,我只是更新了它,这样它就可以工作了。希望这能帮到一个人(事实证明这不是我想要的,但是你付了你的钱,你就有机会了)。
#1
9
Basically you need to create a series array, that contains a dictionary per entry, with a seriesColors
entry. A working example is shown in the following jsfiddle:
基本上,您需要创建一个系列数组,每个条目包含一个字典,其中包含一个seriesColors条目。下面是一个工作示例:
plot1 = $.jqplot('chart1', [[50,100,50,50,75],[80,70,50,50,40]],
{
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
rendererOptions:{ varyBarColor : true }
},
series: [
{seriesColors: [ "#f00", "#4b0", "#b40", '#ff0', '#fb0']},
{seriesColors: ["#a30", "#4b0", "#b40", '#af0', '#fa0']}
],
highlighter: { show: false }
});
(The fiddle may stop working if I the external js files are changed; jsfiddle doesn't have jqplot libraries by default.)
(如果我改变了外部js文件,提琴可能会停止工作;jsfiddle默认没有jqplot库。
#2
0
I came across this today and as dr jimbob had predicted, all the external files had succumbed to link rot. I found a CDN site and updated the fiddle to the latest jQuery & JQPlot resource files, available here: http://jsfiddle.net/delliottg/WLbGt/96/
我今天遇到了这个问题,正如jimbob博士预测的那样,所有的外部文件都被链接到了rot,我找到了一个CDN站点,并将fiddle更新为最新的jQuery和JQPlot资源文件,可以在这里找到:http://jsfiddle.net/delliottg/WLbGt/96/
Just to satisfy the JSFiddle cop on SO that won't let me post this w/o it:
为了让JSFiddle cop满意,这样就不会让我发布这个w/o:
//this is not my code, it's only here to satisfy the SO require that fiddles have
// code associated with them
plot1 = $.jqplot('chart1', [[50,100,50,50,75],[80,70,50,50,40]], {
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
rendererOptions:{ varyBarColor : true }
},
series: [
{seriesColors: [ "#f00", "#4b0", "#b40", '#ff0', '#fb0']},
{seriesColors: ["#00f", "#b0b", "#a30", "#4b0", '#af0']}
],
highlighter: { show: false }
});
I had nothing to do with the fiddle itself, I just updated it so it worked. Hope this helps someone (turns out it wasn't what I was looking for, but ya pays yer money & ya takes your chances).
我和小提琴本身没有任何关系,我只是更新了它,这样它就可以工作了。希望这能帮到一个人(事实证明这不是我想要的,但是你付了你的钱,你就有机会了)。