在javascript的highcharts中使用不同的列表作为每个点的名称

Using different list for names of each point in highcharts in javascripts

本文关键字：列表 highcharts javascript      更新时间：2023-09-26

我有三个数组来自js中的json字典，如下所示：

var a=[]
var b=[]
var c=[]
var d = JSON.parse('{{ dictionary | safe}}');
for (var key in d)  {  
    b.push(d[key]['score']);
    a.push(key);
    c.push(d[key]['text']);
}

我设法使用highchat有一个图表是这样的：

 $('#container0').highcharts({
            title: {
                text: 'Daily News {{ name }}',
                x: -20 
            },
            subtitle: {
                text: 'Source: News.',
                x: -20
            },
            xAxis: {
                categories: a
            },
            yAxis: {
                title: {
                    text: 'Scores'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: colors[3]
                }]
            },
        series: [{
                allowPointSelect: true,
                name: 'news score',
                data: b,
                color: colors[2]
            }]
        });

当我把鼠标移到每品脱上/点击每品脱时，我就会得到值。我想修改它以显示数组c的值。我尝试了很多方法，但都没有成功。我非常感谢你的帮助。

可以通过设置数据点的属性name来设置点的名称。它可以按照API参考中的说明进行，因此每个点都是一个具有name属性的对象，如：

    series: [{
        data: [{
            name: 'Point 1',
            y: 1
        }, 
        ...

在您的情况下，数组[nameString, value]也可以工作。

    series: [{
        data: [
            ['Point 1', 1],
            ...

JSFiddle：http://jsfiddle.net/fnmncx6h/

所以，对于你的代码，你可以使用这样的东西：

var a=[]
var b=[]
var d = JSON.parse('{{ dictionary | safe}}');
for (var key in d)  {  
    b.push([d[key]['text'], d[key]['score']]);
    a.push(key);
}

然后使用CCD_ 4作为序列的数据。

要设置工具提示的文本，您可以使用API中提供的许多格式化函数之一，例如headerFormat、pointFormatter。

相关文章：