0

我有一个使用 highmaps 的世界地图的基本表示。如果我有两种类型的地图,国家大陆

var data = [
    ['eu', 0], 
    ['oc', 1],
    ['af', 2],
    ['as', 3],
    ['na', 4],
    ['sa', 5], 
];

// Create the chart
Highcharts.mapChart('container', {
    chart: {
        map: 'custom/world-continents'
    },

    title: {
        text: 'Highmaps basic demo'
    },

    subtitle: {
        text: 'Source map: <a href="http://code.highcharts.com/mapdata/custom/world-continents.js">World continents</a>'
    },

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

    colorAxis: {
        min: 0
    },

    plotOptions: {
    map: {
        allAreas: false,
    }
  },

    series: [{
        data: data,
        name: 'Random data',
    }]
});

这就是我显示地图的方式。我想做的是用我想要的任何颜色为地图的某些特定部分着色。例如。我只想为欧洲而不是地图的其余部分着色,或者我只想为法国着色而让地图的其余部分不着色。我所做的是,将数据数组更改为具有对象

data =[{name:"Europe", data:[{code: "eu", color: "#CCCCCC"}]},
{name:"Asia", data:[{code: "as", color: "#4A4444"}]},
{name:"Africa", data:[{code: "af", color: "#AC7070"}]},
{name:"Oceana", data:[{code: "oc", color: "#87AC70"}]},
{name:"North America", data:[{code: "na", color: "#70AC9F"}]},
{name:"South America", data:[{code: "sa", color: "#7094AC"}]}

并改变了joinBy:['code'],但没有效果。请给我关于如何实现这一目标的想法/建议。

4

1 回答 1

1

您可以通过替换例如为国家/大陆着色:

['eu', 0],

和:

{'hc-key': 'eu', value: 0, color: 'gold'}, 

然后那个国家/大陆将被相应地着色。hc-key是完成这项工作的重要部分(尽管没有在 API 中直接指定)。

如果您要根据其他属性着色,您可以使用以下内容:Coloring a country in lat-long highmap

一个大陆的工作 JSfiddle 示例: https ://jsfiddle.net/ewolden/8jxu6vtw/

于 2018-11-22T14:15:47.917 回答