jQuery 地圖plugin- JQVMap

map

這是一個很酷的plugin,可以幫你建立起世界地圖,也可以縮放。

外掛網址
JQVMap

用法就指定網頁元素,再使用plugin就好了
  1. jQuery('#vmap').vectorMap(   
  2. {   
  3.     map: 'world_en',   
  4.     backgroundColor: '#a5bfdd',   
  5.     borderColor: '#818181',   
  6.     borderOpacity: 0.25,   
  7.     borderWidth: 1,   
  8.     color: '#f4f3f0',   
  9.     enableZoom: true,   
  10.     hoverColor: '#c9dfaf',   
  11.     hoverOpacity: null,   
  12.     normalizeFunction: 'linear',   
  13.     scaleColors: ['#b6d6ff''#005ace'],   
  14.     selectedColor: '#c9dfaf',   
  15.     selectedRegion: null,   
  16.     showTooltip: true,   
  17.     onRegionClick: function(element, code, region)   
  18.     {   
  19.         var message = 'You clicked "'  
  20.             + region    
  21.             + '" which has the code: '  
  22.             + code.toUpperCase();   
  23.   
  24.         alert(message);   
  25.     }   
  26. });  

使用方法開發者在github上說明的很詳細,有興趣可以玩看看。

Demo

留言