Question

我使用高图对世界地图进行了基本表示。如果我有两种类型的地图，countries和continents。

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']，但没有任何效果。请给我有关如何实现此目标的想法/建议。

Answer 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/

在高地图中使用自己的自定义颜色来设置颜色的国家/地区

1 个答案: