mysql - 如何根据 highcharts 中低于先前值的值动态更改线条颜色

Question

我正在尝试使用使用绿色和黑色的 highchart.js 构建折线图。数据是从 SQL 数据库中提取的，如果该值高于之前的值，则为绿色。如果该值小于先前的值，则颜色为黑色。

我对此很陌生，一直在搜索和搜索，但我发现的唯一的事情就是使用区域来更改颜色。

谁能帮我解决这个问题吗？

Answer 1

我创建了这个示例，它应该对您有帮助:

series: [{
  name: 'Random data',
  colorByPoint: true,
  data: (function() {
    // generate an array of random data
    var time = (new Date()).getTime(),
      i,
      yValue;

    for (i = -19; i <= 0; i += 1) {
      yValue = Math.random();

      if (i > -19 && yValue > data[data.length - 1].y) { // Green point
        zones.push({
          color: "#5f9",
          value: time + i * 1000,
        });
      } else if (i > -19 && yValue <= data[data.length - 1].y) { // black point
        zones.push({
          color: "#000",
          value: time + i * 1000,
        });
      } else { // first point alway green
        zones.push({
          color: "#5f9",
          value: time + i * 1000,
        });
      }
      data.push({
        x: time + i * 1000,
        y: yValue
      });
    }
    return data;
  }()),
  zoneAxis: "x",
  zones: zones
}]

Fiddle