用新值更新JQVMap-map(颜色更改） - Update JQVMap - map with new values (color change)

Update JQVMap - map with new values (color change)

本文关键字：颜色新值更新 JQVMap-map | 更新日期: 2023-09-27

Hi我使用JQVMap在一个国家的工具提示上显示一些值。当该值不为0时，国家/地区显示为绿色。但我有一些问题。为了启动该函数，我使用以下代码。我通过一个div.得到的数据都很好。如果我（使用日期选择器）进行选择，则数据将在地图上的工具提示中更新。因此，为地图提供了正确的值。但如果我换到另一天，例如，值为0的那一天，地图仍然是彩色的，就像值超过0一样。所以不是新地图->旧地图。例如，如果我进行手动网站刷新（使用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');

我想我必须重新绘制或重新加载它…但怎么做呢？

我认为您不应该使用load函数。如果您将ajax与async false一起使用，则可以正常工作。

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;
}