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

问题描述 投票:0回答:1

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

我是新手,并一直在搜索和搜索,但我发现的唯一的事情是使用区域来改变颜色。

谁可以帮我这个事?

mysql highcharts
1个回答
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

© www.soinside.com 2019 - 2024. All rights reserved.