我在我的一个项目中使用 jqPlot 图表。
我正在创建如下所示的图表。
图表工作正常，但折线图值不应堆叠。但是，在我的代码中，线系列值也会堆积起来。
例如:总体而言，堆叠条形图值为 10，折线图值为 50。但是，在我的场景中，折线图值绘制在位置 60 而不是 50。
我的代码如下。
plot = $.jqplot(chartId, [d1, d2, d3], {
seriesColors: ["#d82b25", "#707b7f", "#083a6d"],
title: titles,
stackSeries: true,
animate: true,
animateReplot: true,
cursor: {
style: 'pointer',
show: true,
zoom: false,
looseZoom: false,
showTooltip: false
},
series:[
{
pointLabels: {
show: false
},
renderer: $.jqplot.BarRenderer,
showHighlight: true,
yaxis: 'yaxis',
rendererOptions: {
animation: {
speed: 2500
},
barWidth: 12,
barPadding: 20,
barMargin: 0,
highlightMouseOver: false
}
},
{
pointLabels: {
show: false
},
renderer: $.jqplot.BarRenderer,
showHighlight: true,
yaxis: 'yaxis',
rendererOptions: {
animation: {
speed: 2500
},
barWidth: 12,
barPadding: 20,
barMargin: 20,
highlightMouseOver: false
}
},
{
yaxis: 'y2axis',
rendererOptions: {
animation: {
speed: 2000
}
},
markerOptions: {
show: false
}
}
],
legend: {
show: true,
renderer: $.jqplot.EnhancedLegendRenderer,
rendererOptions: {
numberRows: 2
},
location: 's',
placement: 'outside',
labels: types,
yoffset: 52
},
axesDefaults: {
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
labelOptions: {
fontFamily: 'Arial, sans-serif',
fontSize: '10pt'
},
tickOptions: {
fontFamily: 'Arial, sans-serif',
fontSize: '10pt'
},
pad: 0
},
axes: {
xaxis: {
renderer: $.jqplot.CategoryAxisRenderer,
ticks: ticks,
drawMajorGridlines: false,
tickOptions:{
renderer: $.jqplot.CategoryAxisRenderer,
angle:-90
}
},
yaxis: {
showGridline: false,
tickOptions: {
formatString: "%.1f"
},
rendererOptions: {
forceTickAt0: true
},
label:'Volume($ Billions)',
labelRenderer: $.jqplot.CanvasAxisLabelRenderer
},
y2axis: {
showGridline: false,
tickOptions: {
show: true,
formatString: "%.1f"
},
rendererOptions: {
alignTicks: true,
forceTickAt0: true
},
label:'US($ Millions)',
labelRenderer: $.jqplot.CanvasAxisLabelRenderer
}
},
grid:{
background: '#ffffff',
borderColor: '#333333',
borderWidth: 1.0,
gridLineColor: '#575757'
},
highlighter: {
show: true,
showLabel: true,
tooltipAxes: 'y',
sizeAdjust: 7.5,
tooltipLocation : 'ne'
}
});
请有人帮我解决这个问题。
提前致谢...
最佳答案
如果查看jqPlot框架的源代码并搜索stackSeries行，您可以发现它是这样使用的:
if (this.stackSeries && !series.disableStack)
根据documentation disableStack 属性就是您所需要的。
true to not stack this series with other series in the plot. To render properly, non-stacked series must come after any stacked series in the plot’s data series array.
您的线非堆叠系列放置在条形堆叠系列之后，因此此参数将正常工作。这样使用它:
series:[
{ //...
},
{ // ...
},
{
disableStack: true,
yaxis: 'y2axis',
rendererOptions: {
animation: {
speed: 2000
}
},
markerOptions: {
show: false
}
}
]
关于javascript - 如何为 jqPlot 中的特定数据系列设置 Stack Series false，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19946952/