2016-04-20 6 views
0

jvectormapsを使用してマップを描画しています。ここでは、アラートが発生したマーカーをクリックします。jvectormaps customize onMarkerClick

私はレコードIDとして機能するマーカー配列内にカスタム項目を追加できます。誰かが現在のマーカーのIDにアクセスするように、下のコードのalert(id);行を変更できますか?ここで

が全体のスクリプトです:

$(function(){ 
    var markers = [ 
     {id: 1, latLng: [33.44838, -112.07404], name: 'Phoenix, AZ', style: {r: 12, fill: '#76c043'}}, 
     {id: 2, latLng: [39.73924, -104.99025], name: 'Denver, CO', style: {r: 30, fill: '#ffdd85'}}, 
     {id: 3, latLng: [37.33821, -121.88633], name: 'San Jose, CA', style: {r: 30, fill: '#f58a78'}} 
     ]; 

    var map = new jvm.Map({ 
    container: $('.map'), 
    map: 'us_aea_en', 
    labels: { 
     regions: { 
     render: function(code){ 
      var doNotShow = ['US-RI', 'US-DC']; 

      if (doNotShow.indexOf(code) === -1) { 
      return code.split('-')[1]; 
      } 
     }, 
     offsets: function(code){ 
      return { 
      'CA': [-10, 10], 
      'ID': [0, 40], 
      'OK': [25, 0], 
      'LA': [-20, 0], 
      'FL': [45, 0], 
      'KY': [10, 5], 
      'VA': [15, 5], 
      'MI': [30, 30], 
      'AK': [50, -25], 
      'HI': [25, 50] 
      }[code.split('-')[1]]; 
     } 
     } 
    }, 
    backgroundColor:'#D3D3D3', 
    zoomButtons:false, 
    markers: markers, 
    regionsSelectable: false, 
    markersSelectable: false, 
    markersSelectableOne: false, 
    onMarkerClick: function(event, id){ 
     alert(id); 
    }, 
     onRegionLabelShow: function (e, el, code) { 
       e.preventDefault(); 
     } 
    }); 
}); 

私は今、私はちょうどそれをアクセスするヘルプが必要な、マーカー配列のid: 1id:2id:3バラバラに追加しました。

答えて

0

ちょうど地元のidであなたのマーカーのローカル変数にアクセス:

onMarkerClick: function(event, id){ 
    alert(markers[id].id); 
}, 
+0

はありがとう、私がまさに必要! – Lauren

関連する問題