更新 JQVMap - 使用新值映射（颜色变化）答案

【问题标题】：Update JQVMap - map with new values (color change)更新 JQVMap - 使用新值映射（颜色变化）
【发布时间】：2014-09-15 09:44:39
【问题描述】：

您好，我使用 JQVMap 在一个国家/地区的工具提示上显示一些值。当该值不为 0 时，该国家/地区将显示为绿色。但我有一些问题。要启动该功能，我使用以下代码。我通过 div 获得的数据。一切正常。如果我进行选择（使用日期选择器），数据将在地图上的工具提示中更新。所以正确的值被赋予了地图。但是，如果我更改为值为 0 的其他日期，则地图仍然是彩色的，就像值超过 0 一样。所以不是新的 -> 旧的地图。例如，如果我刷新 manuell 站点（使用 F5），它会显示具有正确值的正确地图。

我该怎么做才能让它工作？

初始化代码：

initJQVMAP: function () {

    var showMap = function (name) {
        jQuery('.vmaps').hide();
        jQuery('#vmap_' + name).show();
    }

    var setMap = function (name) {
        var data = {
            map: 'world_en',
            backgroundColor: null,
            borderColor: '#333333',
            borderOpacity: 0.5,
            borderWidth: 1,
            color: '#c6c6c6',
            enableZoom: true,
            hoverColor: '#244671',
            hoverOpacity: null,
            values: sample_data,
            normalizeFunction: 'linear',
            scaleColors: ['#cfe9d3', '#3cc051'],
            selectedColor: '#244671',
            selectedRegion: null,
            showTooltip: true,
            onLabelShow: function (event, label, code) {

            }
        };

        data.map = name + '_en';
        var map = jQuery('#vmap_' + name);
        if (!map) {
            return;
        }
        map.width(map.parent().parent().width());
        map.show();
        map.vectorMap(data);
        map.hide();
    }

    setMap("world");
    setMap("europe");
    setMap("germany");
    showMap("world");


    jQuery('#regional_stat_world').click(function () {
        showMap("world");
    });

    jQuery('#regional_stat_usa').click(function () {
        showMap("usa");
    });

    jQuery('#regional_stat_europe').click(function () {
        showMap("europe");
    });
    jQuery('#regional_stat_russia').click(function () {
        showMap("russia");
    });
    jQuery('#regional_stat_germany').click(function () {
        showMap("germany");
    });

    $('#region_statistics_loading').hide();
    $('#region_statistics_content').show();
},

更新值的代码：

    $('#div_session_write').load('sessionstart.php?datum1=' + Date.today().add({
       days: -29
    }).toString('yyyy-MM-dd') +'&datum2=' + Date.today().toString('yyyy-MM-dd'));
    $('#geodaten').load('geodata.php');

我想我必须重绘或重新加载它...但是如何？

【问题讨论】：

标签： php javascript jquery ajax jqvmap

【解决方案1】：

我认为你不应该使用加载功能。如果你使用带有 async false 的 ajax 可以正常工作。

onLabelShow: function(event, label, code) {
    myUrl="data/13historical_"+v_mapa+".php";
    $.ajax({
        url: myUrl,
        dataType: 'json',
        async: false,
        success: function(data) {
            $.each(data.votacionData.votaciones.details[0].detail, function(i) {
                if (this[0]==code) {
                    code.replace(/ /g, '_');
                    theTable='<table cellpadding=2 border=0 class="hoverTable">';
                    theTable += "<tr><td><h1 style='color: white'>"+this[1]+"</h1></td></tr>";
                    theTable += "<tr><td>Ganador</td><td>"+this[2]+"</td></tr>";
                    theTable += "<tr><td>Votos</td><td>"+this[3]+"</td></tr>";
                    theTable += "<tr><td>Segundo</td><td>"+this[8]+"</td></tr>";
                    theTable += "<tr><td>Votos</td><td>"+this[9]+"</td></tr>";
                    theTable += "</table>";
                }
            });
        }
    });
    label[0].innerHTML = v_mapa + " \n " + theTable;
}

【讨论】：