Question

我有一个带有条形图的页面，当用户点击通过ajax调用更新的数据表中的表行时，该条形图会更新。

EG：情节数据不固定。

我需要始终为橙色的最大值/最高值着色。显然，最高的栏可能是情节中的任何一个栏。

如何以jqplot的有效方式做到这一点？

我见过各种颜色的条形颜色的例子，但我只需要一种颜色，所有条形都是蓝色，除了最大值，需要是橙色。

我无法看到任何方法。

Answer 1

我想出了一个解决方案，并让这个工作。它不是很优雅，但它有效！

条形颜色只是一个数组，所以我这样做是为了......

1）将所有条形颜色相同

 var colorArray = ['#4bb2c5','#4bb2c5','#4bb2c5','#4bb2c5','#4bb2c5','#4bb2c5','#4bb2c5'];

2）找到最大数据值

 var maxValue = Math.max(data01,data02,data03,data04,data05,data06,data07);

3）如果数据是最大值

，则更改颜色数组值

if (data01 == maxValue) { colorArray[0] = '#fbbc05'; }
else if (data02 == maxValue) { colorArray[1] = '#fbbc05'; }
else if (data03 == maxValue) { colorArray[2] = '#fbbc05'; }
else if (data04 == maxValue) { colorArray[3] = '#fbbc05'; }
else if (data05 == maxValue) { colorArray[4] = '#fbbc05'; }
else if (data06 == maxValue) { colorArray[5] = '#fbbc05'; }
else if (data07 == maxValue) { colorArray[6] = '#fbbc05'; }

4）设置条形图

var bar_options = {
 axesDefaults: { labelRenderer: $.jqplot.CanvasAxisLabelRenderer },
 seriesColors: colorArray,
 seriesDefaults: { renderer: $.jqplot.BarRenderer, rendererOptions: { highlightMouseOver:false, barMargin:5, shadowOffset:1, varyBarColor:true } },
 axes: { xaxis: { renderer: $.jqplot.CategoryAxisRenderer } }
 };

它有效！

希望这有助于其他人！

jqPlot - 条形图 - 始终只颜色最高值

1 个答案: