0

假设我有一个包含两个系列的情节，一个是 OHLC 和 Line。我想自定义工具提示，例如我不想在工具提示中显示时间戳、OHLC 系列的打开和高值，我想添加一些自定义消息到线系列工具提示。

如何在 Highchart 中实现自定义工具提示？

http://jsfiddle.net/ZZAR5/1/

$(function () {

// create the chart
$('#container').highcharts('StockChart', {

    rangeSelector: {
        selected: 2
    },

    title: {
        text: 'AAPL Stock Price'
    },

    series: [{
        type: 'ohlc',
        data: [
            [1147996800000, 63.26, 64.88, 62.82, 64.51],
            [1148256000000, 63.87, 63.99, 62.77, 63.38],
            [1148342400000, 64.86, 65.19, 63.00, 63.15],
            [1148428800000, 62.99, 63.65, 61.56, 63.34],
            [1148515200000, 64.26, 64.45, 63.29, 64.33],
            [1148601600000, 64.31, 64.56, 63.14, 63.55],
            [1148947200000, 63.29, 63.30, 61.22, 61.22],
            [1149033600000, 61.76, 61.79, 58.69, 59.77]
        ]
    }, {
        type: 'line',
        data: [
            [1147996800000, 63.26],
            [1148256000000, 63.87],
            [1148342400000, 64.86],
            [1148428800000, 62.99],
            [1148515200000, 64.26],
            [1148601600000, 64.31],
            [1148947200000, 63.29],
            [1149033600000, 61.76]
        ]
    }]

});

});

4

1 回答 1

2

您可以使用工具提示块中的格式化程序功能控制工具提示的格式。例如：

 tooltip: {
        formatter: function () {
            var s = '<b>' + this.x + '</b>';

            $.each(this.points, function (i, point) {
                s += '<br/>' + point.series.name + ': ' + point.y;
            });

            return s;
        },
        shared: true
    },

这使用 x 值的标题格式化工具提示，并列出每个系列的系列名称和 y。shared: true 表示工具提示在两个系列之间共享，无论您将鼠标悬停在哪个系列上，都显示相同。

有很多关于工具提示的文档以及这里的一些示例：http: //api.highcharts.com/highcharts#tooltip.formatter

还有这里：

http://api.highcharts.com/highstock#tooltip.formatter

于 2013-06-18T08:06:19.807 回答