Question

我想知道是否有办法将动态设置应用于高品质图表的个别标记？我搜索了半天，我觉得API存在问题。似乎没有办法调整特定基准面上的标记设置。例如：

$('#container').highcharts('StockChart', {
    chart : {
        events : {
            load : function () {
                // set up the updating of the chart each second
                var series = this.series[0];
                setInterval(function () {
                    var x = (new Date()).getTime(), // current time
                        y = Math.round(Math.random() * 100);
                    series.addPoint([x, y], true, true);
                }, 1000);
            }
        }
    },
    series : [{
        data : (function () {
            var data = [], time = (new Date()).getTime(), i;
            for (i = -999; i <= 0; i += 1) {
                data.push([
                  { x: time + i * 1000,
                    y: Math.round(Math.random() * 100),
                    marker:{
                        fillColor:'red'
                    }
                  }
                ]);
            }
            return data;
        }())
    }]
}

我已经用一个基本的Highstock演示来说明我的观点。请参阅演示问题的jsfiddle：http://jsfiddle.net/9xj0nz72/1/

也许我的小提琴有错误......或者我可能要在Github上创建一个问题？

非常感谢!!

Answer 1

我必须使用addPoint方法分配样式，您只能推送到data数组。你必须在chart = new Highcharts.StockChart()变量上使用它。

我很确定我得到了你希望使用以下内容。并且为了证明我为每个新点分配了一个随机颜色和半径。

$(function () {

  var chart = new Highcharts.StockChart({
    chart: {
      renderTo: 'container'
    },
    plotOptions: {
      series: {
        marker: {
          enabled: true
        }
      }
    },
    series: [{
      name: 'Random data',
      data: [],
      time: (new Date()).getTime()
    }]
  });

  /* add new random point every 1 second */
  var i = 0;
  setInterval(function () {
    i++;
    chart.series[0].addPoint({
      marker: {
        /* assign a random hex color and radius */
        fillColor: '#' + (Math.random() * 0xFFFFFF << 0).toString(16),
        radius: Math.floor(Math.random() * 10) + 1  
      },
      y: Math.random() * 100,
      x: i * 1000,
    }, true, false);
  }, 1000);

});

Your updated JSFiddle

忽略了Highstock标记特定选项

1 个答案: