Highcharts中的ToolTip

Question

我有一个绘制柱状图的函数。我想在工具提示中添加额外的信息。

下面是我的函数

function arm_bar_graph(result){

    $('#arms_graph').highcharts({
        chart: {
            type: 'column',
            backgroundColor : '#fafafa',
            height : 300,
        },
        title: {
            text: 'Load Per Arm / Open Shipments'
        },
        subtitle: {
            text: ''
        },
        xAxis: {
            categories: result[0],
            labels: {
                    rotation: -45,
                    align: 'right',
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif'
                    }
                }
        },
        yAxis: {
            min: 0,
            title: {
                text: ''
            }
        },
        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}</b></td></tr>',
            footerFormat: '</table>',
            shared: true,
            useHTML: true
        },
        credits: {
            enabled: false
        },
        series: [{
            data: result[1],
            name : 'Open Shipments',
        },
        ]
    });
}

结果是

[
    [
        u'Arm1',
        u'Arm10',
        u'Arm2',
        u'Arm3',
        u'Arm4',
        u'Arm5',
        u'Arm6',
        u'Arm7',
        u'Arm8',
        u'Arm9'
    ],
    [
        10,
        8,
        9,
        7,
        6,
        5,
        4,
        3,
        2,
        1
    ],
    {
        u'Arm10': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 40,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        },
        u'Arm8': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 24,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        },
        u'Arm9': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 19,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        },
        u'Arm6': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 0,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': '1970-01-0100: 00: 00+00: 00'
        },
        u'Arm7': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 22,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        },
        u'Arm4': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 0,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': '1970-01-0100: 00: 00+00: 00'
        },
        u'Arm5': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 24,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        },
        u'Arm2': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 10,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        },
        u'Arm3': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 24,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        },
        u'Arm1': {
            'bags_closed_per_arm': 0,
            'total_pptls_per_arm': 40,
            'last_bagged_on_arm_time': 'NoBagsclosedinthisinterval.',
            'total_shipments_per_arm': 0,
            'bags_open_per_arm': 0,
            'last_packet_scan_arm_time': 'NoShipmentscannedonthisarm.'
        }
    }
]

我想将更多信息添加到工具提示中，该提示包含在result中提供的字典中。我该怎么做呢？当前工具提示显示Y轴值，即result1值。

我如何从字典中添加值呢？

Answer 1

可以使用tooltip.formatter回调来完成此操作

ToolTip格式化程序回调代码：

tooltip: {
     formatter: function() {
          return 'The value for <b>' + this.x + '</b> is <b>' + this.y + '</b>, in series '+ this.series.name;
     }
}

REF:

WORKING DEMO ON JSFIDDLE

快乐编码:)

Answer 2

来自@dreamweiver示例http://api.highcharts.com/highcharts#tooltip.formatter

我需要以下内容，因为我的this.x显示为一个巨大的数字，例如，1395187200000现在很高兴地显示为2014年2月6日星期四

Highcharts.dateFormat('%A, %b %e, %Y', this.x)