JVector Map的onRegionClick事件

Question

在JVector地图中，我需要一个将每个区域链接到一个URL的函数。因此，如果您单击南非，它将带您转到有关南非的信息页面。我知道要从 onRegionClick: function () 开始，但接下来该怎么做对我来说是个谜。

- ObiWanKobi

Answer 1

好的，正如文档所说：

onRegionClick

当用户点击区域路径时将调用回调函数。区域代码将作为参数传递给回调。

因此每次单击区域时，区域代码都会传递给处理程序。如果您在下一页上仅需要代码，则可以将其作为查询字符串直接传递。

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

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

var regionName = map.getRegionName(code);

- j.f.

Answer 2

你可以使用这个HTML主体。

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

将链接“your url address”更改为您的链接地址，而“+ code +”是JVector Map的区域代码。如果您单击地图省份区域，则会链接到该区域。

- Abed Putra