Question

我在highcharts中使用区域图表。我需要堆积区域图表，不得共享工具提示。

请参考这里的小提琴： jsfiddle.net/xqk6etzd /

问题是：当我将鼠标悬停在S2上时（在S1的所有点都为0之后），它在工具提示而不是S2中显示S1值。您可以尝试隐藏S3以进行更好的测试。

同样，不得共享工具提示，因此我在工具提示选项中设置了shared：false。

在highcharts中有这样的错误吗？或者我的代码中有些问题？

请帮忙。

Answer 1

堆叠设置为正常，这意味着一个区域图表位于另一个区域图表之上。行为是正确的：

plotOptions: {
  area: {
    stacking: 'normal'
  },

但是，如果你真的需要改变它，你可以检查实际区域的值，如果它等于零，只需将它与下一个值（jsfiddle）交换：

tooltip: {
  shared: false,
  formatter: function() {
    if (this.y == 0) {
      return this.series.chart.series[1].name + ': ' +this.series.chart.series[1].yData[this.x];
    } else
      return this.series.name + ': ' +this.y;
  }
},

检查jsfiddle示例：

 $(function() {
  $('#container').highcharts({
    chart: {
      type: 'area'
    },
    tooltip: {
      shared: false,
      formatter: function() {
        if ((this.y == 0)&&(this.series.name==this.series.chart.series[0].name)) {
        debugger;
          return '<b>'+ this.series.chart.series[1].name +'</b>:'  +this.series.chart.series[1].yData[this.x];
        } else
          return '<b>'+ this.series.name +'</b>:'  +this.y;
      }
    },
    plotOptions: {
      area: {
        stacking: 'normal'
      },
      series: {
        cursor: 'pointer',
        point: {
          events: {
            click: function() {
              alert("column index: " + this.series.columnIndex);
            }
          }
        }
      }
    },
    series: [{
      index: 1,
      "name": "S1",
      "data": [619, 406, 300, 41, 174, 10, 235, 495, 568, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
    }, {
      index: 2,
      "name": "S2",
      "data": [507, 90, 752, 548, 133, 528, 151, 553, 734, 341, 774, 810, 618, 89, 125, 202, 354, 317, 239, 82, 112, 155, 849, 258, 848]
    }, {
      index: 3,
      "name": "S3",
      "data": [0, 0, 0, 0, 0, 0, 0, 0, 0, 593, 110, 705, 569, 793, 437, 173, 300, 618, 693, 138, 38, 106, 525, 142, 807]
    }]
  });

});

Highcharts：堆积区域工具提示显示错误的值

1 个答案: