首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >单击“区域”上选定区域的j向量映射集颜色。

单击“区域”上选定区域的j向量映射集颜色。
EN

Stack Overflow用户
提问于 2017-01-30 10:02:27
回答 1查看 2K关注 0票数 1

我用了j向量映射

代码语言:javascript
复制
var colorData = {
 "1" : "#fcadb2", 
 "2" : "#0071A4",
 "3" : "#C8EEFF", 
 "4" : "#0071A4",
 "5" : "#C8EEFF", 
 "6" : "#0071A4"

}

代码语言:javascript
复制
$.getJSON ("<?php echo get_template_directory_uri(); ?>/map_data.php?id="+id+"",{},function(mapa){
    var dataC = eval(mapa);
    var countryData = []; 
    //for each country, set the code and value
    $.each(dataC.countries, function() {
        countryData[this.ccode] = this.visits;
    });
    //World map by jvectormap
    $('#world-map').vectorMap({
        map: 'world_mill',
        backgroundColor: "#fff",
        regionStyle: {
            initial: {
                fill: '#e4e4e4',
                "fill-opacity": 1,
                stroke: 'none',
                "stroke-width": 0,
                "stroke-opacity": 1
            }
        },
        series: {
            regions: [{
                    values: countryData,
                    scale: colorData, //['#3E5E6B', '#A6BAC2'],
                    normalizeFunction: 'polynomial'
                }]
        },
        onRegionClick: function (event, code) {
            //alert(code);
            // highlight the countries
            highlight_lang(code);
        }
    });


});



    function highlight_lang(code) {

    var map = $('#world-map').vectorMap('get', 'mapObject');
    map.clearSelectedRegions();
    //clear the array values
    map.series.regions[0].clear();
    map.setSelectedRegions([code]);

}

在“区域”中,单击我调用的函数highlight_lang。通过使用此选项,所选区域将被清除。默认情况下,当单击该区域时,将填充黄色。如何更改选定区域的颜色。

请帮帮我

EN

回答 1

Stack Overflow用户

发布于 2017-03-23 06:20:58

在regionStyle属性中添加选定的属性如下:

代码语言:javascript
复制
regionStyle: {
            initial: {
                fill: '#e4e4e4',
                "fill-opacity": 1,
                stroke: 'none',
                "stroke-width": 0,
                "stroke-opacity": 1
            },
            selected:{
                 fill: "#2A3F52"
}

        },

如果这个问题解决了,请告诉我。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41933136

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档