Question

如何在工具提示中显示数据，这些数据未显示在图表中？也就是说，我只有一个条形图，但CSV文件中有更多数据。现在，我想在工具提示中不仅显示图表数据，还要显示CSV文件中的其他数据。那可能吗？如果是这样，怎么样？

工具提示就像这样：

    tooltip: 
    {
        snap: 0  ,
        useHTML: true,
        padding: 0,
        formatter: function () 
        {
            return 'Year: ' + this.point.x + '</b><br />Annual mass balance: <b>' + this.point.y + ' m w.e.</b><br>Number of observed glaciers: ';
        }
    },

CSV阅读在这里完成：

$.get('data.csv', function(data) {

    var series = {
        data: []
    };

    var temp = []

    // Split the lines
    var lines = data.split('\n');

    // For each line, split the record into seperate attributes
    $.each(lines, function(lineNo, line) {
        var items = line.split(',');

        if (lineNo !== 0) {
            var x = +items[0],
                kwh = parseFloat(items[2]);
            if (!isNaN(kwh)) {
                series.data.push([x, kwh]);
            }
        }
    });

    // Push the completed series
    options.series.push(series);

    new Highcharts.Chart(options);

});

感谢任何提示！

Answer 1

请参阅fiddle updated with extra data in tooltip here

你走了：将您的数据设为{x：某事，Y：某事，额外：ExtraInfoToshowe}，如下所示：

 $.each(lines, function(lineNo, line) {
        var items = line.split(',');

        if (lineNo !== 0) {
            var xValue = +items[0],
                kwh = parseFloat(items[2]);
            if (!isNaN(kwh)) {
                series.data.push({x:xValue,y: kwh, extra:items[3]}); //here I changed
            }
        }
    });

在工具提示格式化程序功能中，调用您想要的额外内容，如下所示：

 formatter: function() {
            return 'Year: ' + this.point.x + '</b><br />Annual mass balance: <b>' + this.point.y + ' m w.e.</b><br>Number of observed glaciers: '+this.point.extra;
        }

如何在Highcharts的工具提示中显示CSV文件中的非图形数据？

1 个答案: