Question

我正在使用JVectorMap创建World Map ..

作为我的JVectorMap的一部分，我在具有人口的区域CountryName上显示..

我的问题是：

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

Ex：对于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。希望它可以帮到你。

基于值范围在JVectorMap区域生成不同的颜色

1 个答案: