javascript - 在 highcharts 条形图上打印一个值？

Question

我使用 highcharts.js 创建了条形图。我在 y 轴上添加了设备名称，在 x 轴上以字节为单位添加了数据包。如何在条形图的条上添加设备联系时间。我在数组中有一个设备联系时间。我想要的是一种打印方式，即时间值在条形图上？

Answer 1

您可以通过启用数据标签并自定义它们来做到这一点。您还需要以特定方式格式化数据:

$(function () {
$('#container').highcharts({
    chart: { type:'bar',
    },
    xAxis: {
        categories: ['Device 1', 'Device 2']
    },

    plotOptions: {
        series: {
            dataLabels: {
                enabled: true,
                formatter:function() {
                    return this.point.t;
                }
            }
        }
    },

    series: [{
        data: [{y:29.9,t:"12:45"}, {y:71.5,t:"14:45"}]        
    }]
});
});

http://jsfiddle.net/NPSEf/

此示例中的数据有一个定义为“t”的附加字段，其中包含您要在条形图上显示的时间。在 dataLabel 格式化程序函数中，您可以引用每个点内的所有数据，包括使用 this.point.t 的 't'。