jqPlot - Различные цветовые полоски на основе диапазона значений для каждой точки данных в серии

Question

Мне нужно изменить цвет столбчатой ​​диаграммы условно для каждой точки данных в одной серии. 1 точка данных в серии должна иметь разные пороговые значения для цвета, чем другие 4 точки данных.

Я попытался реализовать предложения, найденные по адресу this SO post, но я получаю ошибку JS, что объект не имеет метода get.

Это данные я работаю с:

Series 2, должен иметь цвета различались. Данные, которые производят эти серии здесь

1. пороговое значение данных содержит [[2,1], [4,2], [6,3], [3,4], [8, 5]]
результаты
2. данных содержит [[6,1], [6,2], [4,3], [6,4], [6, 5]]

данные результаты относятся к синей гистограммы линий и пороговых данных на оранжевую линию.

Для элемента одного из результатов к элементу 4, мне нужны следующие результаты:

если первый элемент внутреннего массива> = 0 и < = 4, стержень должен быть красным , если первый элемент внутреннего массива> = 5 и < = 7, столбец должен быть желтым , если первый элемент внутренней матрицы равен> = 8 и < = 11, планка должна быть зеленой.

Для элемента пяти результатов, мне нужно: если первый элемент внутреннего массива> = 0 и < = 5, строка должна быть красной , если первый элемент внутреннего массива> = 6 и < = 11, бар должен быть зеленым.

В качестве примера, если resultsSeries[0][0] === 4, тогда цвет бара должен быть красным.

На данный момент, я в порядке с даже итерацией по графику как-то после того, как он был сгенерирован и изменил его таким образом, но я не уверен, как это сделать. Я проверил элементы на нем и просто получил холст, и я не совсем понимаю, как jqPlot влияет на элементы внутри него или на то, что он назвал.

Link to jsFiddle.net

Это приводит к следующей ошибке:

Uncaught TypeError: Object [object Object] has no method 'get' 
jqplot.barRenderer.js:280 
$.jqplot.BarRenderer.draw jqplot.barRenderer.js:280 
Series.draw jquery.jqplot.js:1065 
drawSeries jquery.jqplot.js:2735 
draw jquery.jqplot.js:2249 
$.jqplot jquery.jqplot.js:164 
(anonymous function) jqplot_example.html:71 
n jquery.min.js:2 
o.fireWith jquery.min.js:2 
e.extend.ready jquery.min.js:2 
c.addEventListener.C 

Answer 1

Если вы хотите изменить его, вы должны выполнить все свои методы. Это из исходного кода, и вам необходимо реализовать методы get и setColors.

function (colors) { 
    colors = colors || $.jqplot.config.defaultColors; 
    var idx = 0; 

    this.next = function() { 
     if (idx < colors.length) { 
      return colors[idx++]; 
     } 
     else { 
      idx = 0; 
      return colors[idx++]; 
     } 
    }; 

    this.previous = function() { 
     if (idx > 0) { 
      return colors[idx--]; 
     } 
     else { 
      idx = colors.length-1; 
      return colors[idx]; 
     } 
    }; 

    // get a color by index without advancing pointer. 
    this.get = function(i) { 
     var idx = i - colors.length * Math.floor(i/colors.length); 
     return colors[idx]; 
    }; 

    this.setColors = function(c) { 
     colors = c; 
    }; 

    this.reset = function() { 
     idx = 0; 
    }; 

    this.getIndex = function() { 
     return idx; 
    }; 

    this.setIndex = function(index) { 
     idx = index; 
    }; 
} 

Answer 2

seriesЦвета: значение < порог? ["# ff0000"]: ["# 00ff00"];