Question

我已经Highcharts分散了：

$('#container').highcharts({
    chart: {
        type: 'scatter'
    },
    title: {
        text: 'Title'
    },
    xAxis: {
        title: {
            text: 'Frequency (%)'
        }
    },
    yAxis: {
        title: {
            text: 'Current (%)'
        }
    },
    tooltip: {
        headerFormat: '<b>{series.name}</b><br>',
        pointFormat: '{point.x:.2f}% frequency, {point.y:.2f}% current: xx % efficiency'
    },
    plotOptions: {
        spline: {
            marker: {
                enabled: true
            }
        }
    },
    series: [{
        name: 'Data points',
        data: [
            [10, 25, 96.1],
            [50, 25, 96.3],
            [10, 50, 96.0],
            [50, 50, 96.3],
            [90, 50, 96.4],
            [100, 50, 96.5],
            [10, 100, 96.1],
            [50, 100, 96.3],
            [90, 100, 96.5],
            [100, 100, 96.6]
        ]
    }]
});

对于每个数据点，我提供了三个值。例如，x = 10，y = 25，值= 96.1。我想在点旁边的情节中显示该值。我怎么能这样做？

查看我的JSFiddle。

Answer 1

目前您的价值已被弃用，因为分散仅使用x和y。例如，要保留值，您可以将点作为series.data中的对象提供，如下所示：

series: [{
    name: 'Data points',
    data: [
        {x:10, y:25, value:96.1},
        {x:50, y:25, value:96.3},
        {x:10, y:50, value:96.0},
        //...
    ]
}]

然后您可以使用内置的dataLabels来显示该点旁边的值，如下所示：

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

请参阅this JSFiddle demonstration看起来如何。

Highcharts散布：在绘图中显示值

1 个答案: