如何在未标记为“值”的 JSON 中使用 Highmaps 数据

Question

我有一个包含许多字段的数据集。我无法控制这个 JSON 的创建。示例：

data = [
    {
    'maparea':'3704000063',
    'relatedsource':null,
    'empcount':'198390',
    'response':'78',
    'mean':'61663.00',
    },
...
]

图表代码为：

Highcharts.mapChart('container', {
    chart: {
        map: geojson
    },

    title: {
        text: 'GeoJSON in Highmaps'
    },

    mapNavigation: {
        enabled: true,
        buttonOptions: {
            verticalAlign: 'bottom'
        }
    },

    colorAxis: {
        tickPixelInterval: 100
    },

    series: [{
        data: data,
        keys: ['maparea', 'relatedsource', 'empcount', 'response', 'mean'],
        joinBy: ['fips', 'maparea'],
        name: 'Random data',
        states: {
            hover: {
                color: '#a4edba'
            }
        },
        dataLabels: {
            enabled: true,
            format: '{point.properties.postal}'
        }
    }]
});

geoJSON 使用fips 标记区域（在本例中为北卡罗来纳州的县）。地图显示州和县元素。但是，没有数据用于绘图。这是因为 HighMaps 代码期望 value 元素出现在我认为的数据中。

有没有办法告诉 HighMaps 数据集中的哪个元素用于对等值线进行着色？

Answer 1

我没有看到任何将您的独特数据形状映射到expected keys in the data according to the docs 的选项。根据您的评论，这对于数组是可能的，但对于对象似乎是不可能的。

但是，只需将对象重新映射到所需的形状就很简单了。下面的代码给出了一个部分示例。

let dataMapped = data.map(obj => { 
   var median = Number(obj.median);       
   return Object.assign(obj, { name: obj.maparea, value: median });
});

然后使用dataMapped 作为数据的值。

在 ES6 中可能有一种更优雅的方法来执行此操作，并使用对象传播并避免 Object.assign 我用来将旧对象与新属性合并，但我目前没有时间研究它。