javascript - HighCharts:使用 'split: true' 时,当值为零时隐藏工具提示

标签 javascript highcharts

我有一个 HighChart 如下:

    new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'line'
        },
        title: {
            text: 'Monthly Average Temperature'
        },
        xAxis: {
            categories: ['aa', 'bb', 'cc']
        },
        yAxis: {
            title: {
                text: 'Infor'
            }
        },
        tooltip: {
                split: true,
        },
        plotOptions: {
            line: {
                dataLabels: {
                    enabled: true
                }
            }
        },
        series: [{
            name: 'a',
            data: [1, 0, 2]
        }, {
            name: 'b',
            data: [0, 3, 5]
        }]
    });

我使用了 config: tooltip: {split: true}。

如果值为零,我想隐藏工具提示。

例如,name='a' 的系列将隐藏第二个工具提示,但 name='b' 的系列仍会继续显示。

或者 name='b' 的系列将隐藏第一个工具提示,但 name='a' 的系列仍然继续显示。

非常感谢!

最佳答案

您可以包装 Tooltip.prototype.renderSplit(points, labels) 方法,因此它不会为值为 0 的点创建工具提示。

包装器可能如下所示(它仅隐藏值为 0 的第一个点):

Highcharts.wrap(Highcharts.Tooltip.prototype, 'renderSplit', function (p, labels, points) {
var i = 0, len = points.length, point, label, modified = false;
for (; i < len; i++) {
  if (points[i].y === 0) {
    point = points.splice(i, 1)[0];
    label = labels.splice(i + 1, 1)[0];
    modified = true;
    break;
  }
}

p.call(this, labels, points);

if (modified) {
  points.splice(i, 0, point);
  labels.splice(i + 1, 0, label);
}
});

示例:http://jsfiddle.net/vjusg30a/

关于javascript - HighCharts:使用 'split: true' 时,当值为零时隐藏工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41558222/

相关文章:

javascript - Highcharts 情节线标签事件

javascript - Highcharts 热图上的多个轴

angular - 如何在 typescript 中导入 highcharts 离线导出

javascript - 以下标和上标的形式在 highcharts Xaxis 和 Yaxis title 上显示内容

asp.net 4.0 webforms - 如何以简单的方式将 ContentPlaceHolder1_ 排除在客户端 ID 之外?

javascript - EasyRTC/WebRtc - 3G 视频通话不起作用

javascript - AngularJS 指令 - 指定回调的默认值

javascript - Knockout.js 中未定义的绑定(bind)

javascript - jquery 没有正确处理来自 twitter api 调用的 jsonp 数据

javascript - 不同图表之间的视觉差异