如何显示比Highcharts一个“Datamax公司”吗？

Question

目前，我展示的折线图中一个最大点。但我想改变dataMax在chart.How向前五名最大价值点，我可以在Highcharts实现这一目标？

var defaultData = 'urlto.csv';
var urlInput = document.getElementById('fetchURL');
var pollingCheckbox = document.getElementById('enablePolling');
var pollingInput = document.getElementById('pollingTime');

function createChart() {
  Highcharts.chart('closed5', {
    chart: {
      type: 'area',
      zoomType: 'x'
    },
    plotOptions: {
      series: {
        dataLabels: {
          enabled: true,
          style: {},
          formatter: function() {
            if (this.y === this.series.dataMax) {
              return this.y;
            }
          }
        }
      }
    },
    title: {
      text: 'Chart for charting'
    },
    data: {
      csvURL: urlInput.value,
      enablePolling: pollingCheckbox.checked === true,
      dataRefreshRate: parseInt(pollingInput.value, 10)
    }
  });

  if (pollingInput.value < 1 || !pollingInput.value) {
    pollingInput.value = 1;
  }
}

urlInput.value = defaultData;

// We recreate instead of using chart update to make sure the loaded CSV
// and such is completely gone.
pollingCheckbox.onchange = urlInput.onchange = pollingInput.onchange = createChart;

// Create the chart
createChart();

Answer 1

作为@ewolden正确地注意到，你可以整理你的数据，仅显示5个最高值：

var data = [11, 22, 33, 44, 55, 66, 15, 25, 35, 45, 55, 65],
    sortedData = data.slice().sort(function(a, b){
        return b - a
    });

Highcharts.chart('container', {
    series: [{
        data: data,
        dataLabels: {
            enabled: true,
            formatter: function() {
                if (sortedData.indexOf(this.y) < 5) {
                    return this.y;
                }
            }
        }
    }]
});

现场演示：http://jsfiddle.net/BlackLabel/xkf2w5tb/

API：https://api.highcharts.com/highmaps/series.mapbubble.dataLabels.formatter

Answer 2

据我所知formatter回调是对数据进行格式化标签的方式。如果你想显示前N个点，你应该在一个新的阵列中的数据进行排序，并拉前5名的值。这是如何克隆和对数组进行排序，并提取在formatter呼叫顶部5个元素的例子。

let data = [32, 10, 20, 99, 30, 54, 85, 56, 11, 26, 15, 45, 55, 65];
//Copy the array
let temp = data.slice();
// Sort the temp array in descending order
temp.sort((a, b) => b - a);

Highcharts.chart('closed5', {
  chart: {
    type: 'area',
    zoomType: 'x'
  },
  title: {
    text: 'Chart for charting'
  },
  series: [{
    data: data,
    dataLabels: {
      enabled: true,
      formatter: function() {
        if (temp.indexOf(this.y) < 5) {
          return this.y;
        }
      },
    },
  }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="closed5"></div>