JVector映射onRegionClick事件

JVector Map onRegionClick Event

本文关键字:事件 onRegionClick 映射 JVector      更新时间:2023-09-26

所以在JVector map中,我需要一个将每个区域链接到URL的函数。如果你点击南非,它会把你带到一个关于南非的信息页面。我知道从onRegionClick: function ()开始,但从那里开始对我来说是个谜。

嗯,正如文档所说:

onRegionClick

回调函数,当用户单击区域路径。区域代码将被传递给回调函数论点。

因此,每次单击一个区域时,该区域的代码将传递给处理程序。然后,如果代码是你需要的所有在你的下一页,你可以把它作为查询字符串传递。

onRegionClick: function (event, code) {
    window.location.href = "yourpage?regionCode=" + code
},

如果您需要区域的实际名称而不是代码,您可以使用一个方便的getRegionName方法。

var regionName = map.getRegionName(code);

你可以使用这个html body

<div class="map_jvector"></div>

和javascript

        <script>                
            $('.map_jvector').vectorMap({
              map: 'africa',
              backgroundColor: '#ffffff',
              onRegionClick:function(event, code){            
                      var name = (code);                          
                            window.location.replace("http://your url address/"+code+"");
                      },
              series: {
                regions: [{
                  values: gdpData,
                 scale: ['#003471','#009eef', '#0076a3','#0d004c','#f26522','#9e0039'],
                  normalizeFunction: 'polynomial'
                }]
              },
              onRegionTipShow: function(e, el, code){
                el.html(el.html());
              }
            });
        </script>

将链接"您的url地址"更改为您的链接地址&

"+码+"为JVector地图的区域,点击地图上的省份区域,将链接该区域