在高图中使用自己定制的颜色为时装店/大陆上色

Question

我有一个使用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"}]}

改变CCD_ 1，但无明显影响。请给我如何实现这一目标的想法/建议。

Answer 1

您可以通过替换来为国家/大陆上色，例如：

['eu', 0],

带有：

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

然后，这个国家/大陆将被相应地涂上颜色。hc-key是实现这一工作的重要组成部分(尽管API中没有直接指定(。

如果你要根据其他属性进行着色，你可以使用这样的方法：在长距离高图中为一个国家着色

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