2014-04-14 65 views
2

我設法使用jVectorMap和地圖中的標記創建地圖。jVectorMap - 如何從標記中獲取值並將其存儲到變量中

現在,當用戶點擊它時,如何從標記中獲取值?

的jsfiddle鏈接:http://jsfiddle.net/fqqGs/78/

 $(function(){ 
     $('#map').vectorMap({ 
     map: 'us_aea_en', 
     zoomOnScroll: false, 
     hoverOpacity: 0.7, 
     markerStyle: { 
      initial: { 
      fill: '#F8E23B', 
      stroke: '#383f47' 
      } 
     }, 
markers: [ 
    {latLng: [41.50, -87.37], name: 'Chicago', newvalue: '300'}, 
      {latLng: [32.46, -96.46], name: 'Dallas', newvalue: '301'}, 
      {latLng: [36.10, -115.12], name: 'Las Vegas', newvalue: '302'}, 
      {latLng: [34.3, -118.15], name: 'Los Angeles', newvalue: '303'}, 
      {latLng: [40.43, -74.00], name: 'New York City', newvalue: '304'} 
     ], 
      onMarkerClick: function(event, index){ 
    var a = 2; 
var b=2+newval; //need to get the value from each markers and save the value to newval 
alert(b); 

} 
     }); 
    }); 

回答

1

分配標記數組變量,你可以在地圖上標記和onMarkerClick瓶蓋內都分配引用匿名函數內。

的jsfiddle鏈接:http://jsfiddle.net/hansenmc/3Cf8r/

$(function() { 
     //assign markers to a variable 
     var mapMarkers = [ 
       {latLng: [41.50, -87.37], name: 'Chicago', newvalue: '300'}, 
       {latLng: [32.46, -96.46], name: 'Dallas', newvalue: '301'}, 
       {latLng: [36.10, -115.12], name: 'Las Vegas', newvalue: '302'}, 
       {latLng: [34.3, -118.15], name: 'Los Angeles', newvalue: '303'}, 
       {latLng: [40.43, -74.00], name: 'New York City', newvalue: '304'} 
     ]; 

     $('#map').vectorMap({ 
      map: 'us_aea_en', 
      zoomOnScroll: false, 
      hoverOpacity: 0.7, 
      markerStyle: { 
       initial: { 
        fill: '#F8E23B', 
        stroke: '#383f47' 
       } 
      }, 
      markers: mapMarkers, 
      onMarkerClick: function (event, index) { 
       var a = 2; 
       //retrieve marker by the index and parse the string value as an integer 
       var newval = parseInt(mapMarkers[index].newvalue); 
       var b = 2 + newval; //need to get the value from each markers and save the value to newval 
       alert(b); 
      } 
     }); 
    }); 
相關問題