如何在 Highchart 标签中计算 IF 值

Question

我喜欢使用 Highstock this
并希望在 {point.y} 之后显示等级标签，例如 "KPAX: 3.10, B"（请看图片）。
所以我在数据库中有成绩值，或者是否可以使用 IF 获取成绩值？

这是我的代码：

$(function() {
  var seriesOptions = [],
    seriesCounter = 0,
    names = ['KPAX'];

  /**
   * Create the chart when all data is loaded
   * @returns {undefined}
   */
  function createChart() {
    $('#container').highcharts('StockChart', {
      legend: {
        enabled: true
      },
      rangeSelector: {
        selected: 4
      },
      yAxis: [{
        labels: {
          formatter: function() {
            return this.value;
          }
        },
        plotLines: [{
          value: 0,
          width: 2,
          color: 'silver'
        }]
      }, {
        opposite: true
      }, {
        opposite: true
      }, {
        opposite: true
      }],

      plotOptions: {
        series: {
          compare: 'normal'
        }
      },
      tooltip: {
        pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b><br/>',
        valueDecimals: 2
      },
      series: seriesOptions
    });
  }

  $.each(names, function(i, name) {
    var url = "asset/data/testdata.php?id=<?=$id?>&callback=?";
    $.getJSON(url, function(data) {
      seriesOptions[i] = {
        name: name,
        data: data,
        dataGrouping: {
          approximation: "average",
          enabled: true,
          forced: true,
          units: [
            ['month', [1]]
          ],
        },
      };

      // As we're loading the data asynchronously, we don't know what order it will arrive. So
      // we keep a counter and create the chart when all the data is loaded.
      seriesCounter += 1;

      if (seriesCounter === names.length) {
        createChart();
      }
    });
  });
});

Answer 1

您可以使用 pointFormatter 函数代替 pointFormat。在此函数中，您可以添加负责计算成绩的代码：

  tooltip: {
    pointFormatter: function() {
      var grades = ['F', 'D', 'C', 'B', 'A'],
        index = Math.floor(this.y),
        grade = grades[index - 1];

      var text = '<span style="color:' + this.series.color + '">' + this.series.name + '</span>: <b>' + this.y + '</b>, ' + grade + '<br/>';
      return text;
    },
  },

在这里您可以看到它如何工作的简单示例：http://jsfiddle.net/3v9wzp90/4/

如何在 Highchart 标签中计算 IF 值

How to IF value in Highchart label

javascript

jquery

highcharts

highstock