线系列和散点图的 Highcharts 共享工具提示不起作用

Question

我有一个包含几个线系列和一个散点图的图表，并且我已将共享工具提示属性设置为 true，如此 fiddle http://jsfiddle.net/tpo4caoz/。我看到线系列有一个共享的工具提示，但散点图本身有一个单独的工具提示。

$(function () {
    $('#container').highcharts({

        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul',
                                     'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },

        tooltip: {
            shared: true
        },

        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
            type: 'scatter'

        }, {
            data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5]
        },{
            data: [210.4, 190.1, 90.6, 50.4, 20.9, 70.5, 105.4, 120.2, 140.0, 170.0, 130.6, 140.5]
        }]
    });
});

我是不是遗漏了什么？

Answer 1

这是 Highcharts 问题跟踪器中的现有问题

Part of the issue is that shared tooltip shouldn't work on scatter series at all, because they are not sorted and laid out in increasing X order. This should be noted in the docs(link).

Answer 2

根据 highcharts api http://api.highcharts.com/highcharts#tooltip.shared 工具提示共享仅适用于有序数据，不适用于饼图、散点图、标志等

Answer 3

你可以试试这个 http://jsfiddle.net/8qt0d4h0/

新的 highcharts 无法在 pie/scatter/flag 中共享工具提示，因此您可以将散点图处理为 spline ，并将 lineWidth 设置为相等并将 states hover 设置为等于 0。

$(function () {
    $('#container').highcharts({

        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul',
                                     'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },

        tooltip: {
            shared: true
        },

        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
            type: 'spline',
            "lineWidth": 0,
                        "marker": {
              "enabled": "true",
              "states": {
                "hover": {
                  "enabled": "true"
                }
              },
              "radius": 5
            },
          "states": {
            "hover": {
              "lineWidthPlus": 0
            }
          },
        }, {
            data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5]
        },{
            data: [210.4, 190.1, 90.6, 50.4, 20.9, 70.5, 105.4, 120.2, 140.0, 170.0, 130.6, 140.5]
        }]
    });
});

Answer 4

添加这行代码：

Highcharts.seriesTypes.scatter.prototype.noSharedTooltip = false;

它禁用 Hicharts 默认设置，该设置禁用散点图包含在 shared/split 工具提示中。这样你就不必像其他人建议的那样使用样条曲线，这不会导致样条线后面的工具提示等问题。

线系列和散点图的 Highcharts 共享工具提示不起作用

Highcharts shared tooltip for line series and scatter plot not working

html

javascript

jquery

highcharts

highstock