highcharts 为国家a地区中的每个地区/省设置不同的颜色

mm9b1k5b  于 2022-11-10  发布在  Highcharts
关注(0)|答案(2)|浏览(277)

我已经创建了一个印度尼西亚省的Map。我已经为每个地区设置了“id区域”和颜色。我不知道如何在Highmaps中应用不同的颜色。

查看我的js fiddle
我已经在系列属性中添加了'colors',但似乎不起作用。任何帮助!
"这是我的准则"

//set color region in here
    var data = [
    ['id-ac',"#8EE244"], //Aceh
    ['id-su',"#8644FE"]  //Sumatera Utara
    //more 31 province or region
];

// Create the chart
Highcharts.mapChart('container', {
    chart: {
        map: 'countries/id/id-all'
    },

    title: {
        text: 'Indonesia Maps'
    },
    mapNavigation: {
        enabled: true,
        buttonOptions: {
            verticalAlign: 'top'
        }
    },

    legend: {
            enabled: false
        },

    credits: {
      enabled: false
    },
    plotOptions:{
        series:{
            point:{
                events:{
                    click: function(){
                        //console.log(this);
                        alert("Province Code : "+this.options['hc-key']);
                    }
                }
            }
        }
    },
    series: [
    {
        data:  data,
        name: 'Provinsi',
        tooltip: {
           headerFormat: '',
           pointFormat: '{point.name}'
        },
        states: {
            hover: {
                color: '#BADA55'
            }
        }
    }
    ]
});
2guxujil

2guxujil1#

只需对代码进行非常小的更改即可解决此问题,只需提供一个keys值:

series: [{
    data:  data,
    keys: ['hc-key', 'color'],
    // ...
}]

这会将数据中的第一个值Map到给定数据点的hc-key,将第二个值Map到给定数据点的color
请参阅this JSFiddle demonstration中的使用说明。

lrl1mhuk

lrl1mhuk2#

我已经为我的国家/地区印度设置了区域颜色。https:jsfiddle.net/vivekpawsan624/bzu32ma4/14/

相关问题