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

 }
        });
    });  

person Jasmine    schedule 14.04.2014    source источник


Ответы (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);
           }
       });
   });
person Mads Hansen    schedule 22.04.2014