javascript - Highcharts 分组列，隐藏在工具提示中

Question

我在 highcharts 中使用分组列，我需要在工具提示 (shared: true) 中仅显示使用列。但我看到所有分组列 http://jsfiddle.net/8o6umxdp/ ，我只想查看此字段中列的值，而不是分组。我隐藏了这个图例“showInLegend: false”，但这个图例显示在工具提示中。

Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Monthly Average Rainfall'
    },
    subtitle: {
        text: 'Source: WorldClimate.com'
    },
    xAxis: {
        categories: [
            'Jan',
            'Feb',
            'Mar',
            'Apr',
            'May',
            'Jun',
            'Jul',
            'Aug',
            'Sep',
            'Oct',
            'Nov',
            'Dec'
        ],
        crosshair: true
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Rainfall (mm)'
        }
    },
    tooltip: {
        headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
        pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
            '<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
        footerFormat: '</table>',
        shared: true,
        useHTML: true
    },
    plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0,
            grouping: true
        }
    },
    series: [ {
        name: 'Tokyo',
        data: [0, 0, 0, 0, 0, 0, 5, 0, 0, 0, 0, 0],
        grouping: 'tok',
        showInLegend: false

    }, {
        name: 'Tokyo',
        data: [1, 0, 3, 0, 4, 0, 0, 0, 0, 0, 0, 0]

    }, {
        name: 'New York',
        data: [0, 0, 0, 0, 33, 0, 0, 0, 0, 0, 0, 0],
        grouping: 'mew',
        showInLegend: false
    }, {
        name: 'New York',
        data: [80, 0, 0, 42, 23, 0, 0, 0, 0, 0, 0, 0],

    }, {
        name: 'London',
        data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2]

    }, {
        name: 'Berlin',
        data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1]

    }]
});

但是这里只有柏林和伦敦，如何隐藏东京和纽约

Answer 1

您可以将 pointFormat 替换为 pointFormatter 并按 Series.showInLegend 进行过滤。

例如 ( JSFiddle ):

// ...
tooltip: {
    pointFormatter: function() {
        if(this.series.options.showInLegend !== false)
            return '<tr><td style="color:'+this.series.color+';padding:0">'+this.series.name+': </td><td style="padding:0"><b>'+this.y.toFixed(1)+' mm</b></td></tr>';
    }
}

这应该模仿您的 pointFormat 样式，但允许更多动态包含。