jvectormap - 根据值的范围在 JVectorMap 区域上生成不同的颜色

Question

我正在使用 JVectorMap 创建世界地图。

作为我的 JVectorMap 的一部分，我在 CountryName 和 Population 地区显示..

我的问题是：

如何根据人口范围为区域（国家）显示不同的颜色。

例如：对于 1-1000 人口，我必须显示红色。对于 1000-5000 人口，我必须显示蓝色。

我正在使用这样的代码。但它没有根据人口范围显示不同的颜色

var mapData = {
  "AF": 1000,
  "AL": 5000,
  "DZ": 20000,
  ...
};

     try{
                        $('#id').vectorMap(
                        {
                            map : 'world_mill_en',
                            series : {
                                regions : [ {
                                    initial : {
                                        fill : 'white',
                                        "fill-opacity" : 1,
                                        stroke : 'none',
                                        "stroke-width" : 0,
                                        "stroke-opacity" : 1
                                    },
                                    hover : {
                                        "fill-opacity" : 0.8
                                    },
                                    selected : {
                                        fill : 'yellow'
                                    },
                                    selectedHover : {},
                                    values : mapData,
                                    scale : [  '#C8EEFF', '#0071A4' ],
                                    normalizeFunction : 'polynomial'
                                } ]
                            },
                            onRegionLabelShow : function(e, el, code) {
                                el.html(el.html()+' (Population - '+mapData[code]+')');
                            }
                        });
            }
    catch(err){
            alert(err);
        }

任何人都可以帮助我根据人口范围为区域显示不同的颜色......？提前致谢..

Answer 1

JSON根据您的区域和颜色创建一个这样的计数和颜色代码。

var colorData = {
     "1" : "#C8EEFF", 
     "2" : "#0071A4",
     "3" : "#C8EEFF", 
     "4" : "#0071A4",
     "5" : "#C8EEFF", 
     "6" : "#0071A4"
}

并将其传递JSON给scale : colorData. 希望它可以帮助你。