更新JQVMap - 使用新值映射(颜色更改)

时间:2013-07-22 20:44:53

标签: php javascript jquery ajax jqvmap

您好我使用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');

我想我必须重新绘制或重新加载...但是如何?

1 个答案:

答案 0 :(得分:0)

我认为你不应该使用加载功能。如果你使用带有异步的ajax,则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;
}