map - 悬停在特定国家/地区时，在空白世界地图上突出显示国旗

Question

我正在使用 jVectormap在世界地图上突出显示国家/地区的插件。现在正如我的问题所暗示的，我想在特定国家悬停时显示国家的国旗。

我不想为整个世界地图做图像映射。所以不要发布那个解决方案，我认为它不是一个可行的解决方案，因为我没有时间这样做。

如果有人使用任何插件、svg、谷歌地图、js 完成此功能，请帮助我。

如果有任何付费插件，那么我想知道。我已经搜索了2天。但我还没有遇到过这样的功能。

Answer 1

您可以为 onRegionLabelShow 提供函数使用区域 code为国旗构造一个 URL，然后自定义 label .

$(function() {
    $('#map').vectorMap({
        onRegionLabelShow: function(event, label, code)
        {
           label.html(label.html()+
           '<br><img src="'+getFlagImgSrc(code)+'" height="20">');
        }
    });

    /*
    * Constructs a URL for a country flag image on Flags Of The World 
    * using the ISO-3166 Digraph 
    */
    function getFlagImgSrc(code)
    {
       return 'http://www.fotw.us/images/'+
               code.toLowerCase().substring(0,1)+
               '/'+
               code.toLowerCase()+
               '.gif';  
    }    

});​

当您将鼠标悬停在一个地区上时，呈现的标签与国家标志的外观示例: