将 Value Json Data 获取到系列名称 Highchart答案

【问题标题】：Get Value Json Data to series name Highchart将 Value Json Data 获取到系列名称 Highchart
【发布时间】：2020-10-01 03:58:48
【问题描述】：

我有数据 Json：

0: {nama: "Democrats", drilldown: "Democrats-2010", y: 17}
    drilldown: "Democrats-2010"
    nama: "Democrats"
    y: 17

1: {nama: "Other", drilldown: "Other-2010", y: 14}
   drilldown: "Other-2010"
   nama: "Other"
   y: 14

2: {nama: "Republican", drilldown: "Republican-2010", y: 11}
   drilldown: "Republican-2010"
   nama: "Republican"
   y: 11

如何将值“nama”应用于 highchart 数据系列

【问题讨论】：

您确定您的 json 数据格式正确吗？请重新格式化您的 json 数据。我看到的是有重复的数据。一个有索引，另一个没有索引。

标签： javascript json highcharts

【解决方案1】：

您需要将 JSON 数据调整为 Highcharts 要求的格式。示例：

    series: [{
        data: data.map(el => ({
            name: el.nama,
            drilldown: el.drilldown,
            y: el.y
        }))
    }],
    xAxis: {
        type: 'category'
    }

现场演示： http://jsfiddle.net/BlackLabel/ncxe1h36/

API 参考： https://api.highcharts.com/highcharts/series.column.data

【讨论】：

【解决方案2】：

我以为你会想要条形图，我已经做了一个。我假设以下数据是您想要使用条形图构建的数据。我使用 jQuery 将你的 jsonData 存储在数组中，这样你就可以看到一步一步的来了。

已编辑：这里是 jsFiddle， https://jsfiddle.net/kopigod/vn4abw92/1/

var namaArray = [],
    yArray = [];

var jsonData = [
    {nama: "Democrats", drilldown: "Democrats-2010", y: 17},
    {nama: "Other", drilldown: "Other-2010", y: 14},
    {nama: "Republican", drilldown: "Republican-2010", y: 11}
];

$.each(jsonData, function(index, value){
  namaArray.push(value.nama);
  yArray.push(value.y);
});


Highcharts.chart('YourChartIdInHTML', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Your main title'
    },
    xAxis: {
        categories: namaArray
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Y-axis Title'
        }
    },
    plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0
        }
    },
    series: [{
     name: "Test",
     data: yArray
    }]
});

当然，当您将鼠标悬停在栏上时，HighChart 允许您自定义文本。

【讨论】：

series: [{ name: nama /// get Value nama data: yArray }] 我的意思是 name: 填写值 name Ex: series: [{ name : "Democrats", data : 17 }]
我的系列是一个名为Test的类别。可以有多个类别，只需要写成数组形式即可。