Highcharts,最小,最大,附加标签

时间:2014-04-08 16:09:33

标签: highcharts label max min

我有大约2000点的时间线图,数据是从csv文件加载的。 我想为最小,最大和最后一点添加标签。

当我以这种方式这样做而不是花费太多时间来生成它。 我怎样才能更快地完成这项工作?

var chart = new Highcharts.Chart(options);
chart.series[0].data[chartMinNo].update({ 
  marker: {
    radius: 2,
    lineColor: '#CC2929',
    lineWidth: 2,
    fillColor: '#CC2929',
    enabled: true
  },
  dataLabels: {
    enabled: true,
    borderRadius: 3,
    borderColor: '#CC2929',
    borderWidth: 1,
    y: -23,
    formatter: function() {
      return "Min : " + chartMinValue;
      }
    }
});

1 个答案:

答案 0 :(得分:2)

效果很慢,因为你使用的是Highcharts,显示2000点不是最好的主意。我建议使用Highstock,其中点被分组以显示平均值/总和/等。分组。

但是,这里是演示

代码:http://jsfiddle.net/me5Uf/2/

    $('#container').highcharts({
        xAxis: {
            type: 'datetime'
        },
        plotOptions: {
            series: {
                marker: {
                    enabled: false
                },
                dataLabels: {
                    enabled: true,
                    formatter: function () {
                        if (this.point.options.showLabel) {
                            return this.y;
                        }
                        return null;
                    }
                }
            }
        },
        series: [{
            name: 'AAPL',
            data: data,
            tooltip: {
                valueDecimals: 2
            }
        }]
    }, callback);
});

function callback(chart) {
    var series = chart.series[0],
        points = series.points,
        pLen = points.length,
        i = 0,
        lastIndex = pLen - 1,
        minIndex = series.processedYData.indexOf(series.dataMin),
        maxIndex = series.processedYData.indexOf(series.dataMax);

    points[minIndex].options.showLabel = true;
    points[maxIndex].options.showLabel = true;
    points[lastIndex].options.showLabel = true;
    series.isDirty = true;
    chart.redraw();
}