2016-08-02 2 views
-1

Я добавил на карту google несколько полигонов и многопользователей из геоионных данных. Мне нужно распечатать название стран в префиксе, когда событие «mousemove» находится в многоугольнике. Я также установил легенду, и я хочу перезагрузить ее, когда событие «dblclick» находится на полигоне.добавление нескольких AddListener в многоугольниках google map

Вот моя проблема: я не могу выполнить событие «mousemove» и «dblclick» для всех полигонов и многопотолей, он просто берет последний полигон и многополигон, забрасываемый моей функцией.

Вот мой полный код (ДОПОЛНЕНО):

var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 5, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 
    var countries = ['Germany','France','Moldova','Italy','Spain']; 
    var infoWindow = document.createElement('div'); 
     infoWindow.id = 'infoWindow'; 
     var content1 = []; 
     content1.push('<h3>Default </h3>'); 

     infoWindow.innerHTML = content1.join(''); 
     infoWindow.index = 2; 
     map.controls[google.maps.ControlPosition.TOP_RIGHT].push(infoWindow); 

    var state = new google.maps.Data(); 
    var poly ; 
    var polys = new Array(); 


    var gaArr = new Array(); 
    var p = 0; 
    var mp = 0; 

//the problem is here 
    state.addListener('addfeature',function(evt) { 
//my 5 objects pass here 
    var CouName = evt.feature.getProperty('name'); 
    if (evt.feature.getProperty('type') == 'Polygon') { 
     var ga = state.getFeatureById(CouName); 
     var gaGeom = ga.getGeometry(); 
     gaArr = gaGeom.getAt(0).getArray(); 
     poly = new google.maps.Polygon({paths:gaArr, map:map,clickable:false,visible:false}); 
     google.maps.event.addListener(map,'dblclick',function(evt){ 
     if (google.maps.geometry.poly.containsLocation(evt.latLng, poly)) { 
     legend.innerHTML = CouName; 
     } 
     }); 

    google.maps.event.addListener(map,'mousemove',function(evt){ 
     if (google.maps.geometry.poly.containsLocation(evt.latLng, poly)) { 
     infoWindow.innerHTML = CouName; 
     } 
    }); 
    p++; 

    } 

     if (evt.feature.getProperty('type') == 'MultiPolygon') { 
     var ga = state.getFeatureById(CouName); 
     var gaGeom = ga.getGeometry(); 
     gaArr = gaGeom.getArray(); 
     for (var i=0;i<gaGeom.getArray().length;i++){ 
     polys[i]= new google.maps.Polygon({paths:gaArr[i].getAt(0).getArray(), map:map,clickable:false,visible:false}); 
     } 

     google.maps.event.addListener(map,'dblclick',function(evt){ 
    for(var i=0;i<gaArr.length;i++){ 
     if (google.maps.geometry.poly.containsLocation(evt.latLng, polys[i])) { 
     legend.innerHTML = CouName; 
     } 
     } 
     }); 

    google.maps.event.addListener(map,'mousemove',function(evt){ 
    for(var i=0;i<gaArr.length;i++){ 
     if (google.maps.geometry.poly.containsLocation(evt.latLng, polys[i])) { 
     infoWindow.innerHTML = CouName; 
     } 
     } 
     }); 
    mp++; 
    } 
    }); 
    for (var country in countries){ 
      state.loadGeoJson('http://.../GoogleMaps/'+countries[country]+'.geojson', { 
      idPropertyName: 'name' 

      }); 

    } 
    state.setMap(map); 
    //to color the polygons 
    state.setStyle(function(feature) { 

      var k = feature.getProperty('color'); 
      return { 
       fillOpacity:0.6, 
       fillColor:k, 
       strokeWeight:1, 
       clickable: false 
      } 
     }); 

Я думаю, что проблема является массив полигонов Полигон и полигон поли удаляются, когда state.addListener перейти к другому многоугольник или MultiPolygon, и, как я сказал, addlistener работает для последних многоугольников и мультиполигона, забрасываемых функцией.

Я не знаю, если это может помочь, но ниже пример моих GeoJSON файлов:

{"type":"Feature","properties":{"color":"purple","name":"Germany","type": 
"MultiPolygon"},"geometry":{"type": "MultiPolygon","coordinates": 
[[[[8.5636100769042969,54.684165954589844], 
[8.5948600769042969,54.719856262207031],[8.5851364135742187,54.7445068359375], 
[8.5511093139648437,54.753883361816406],[8.4447212219238281,54.74832...]]]]}} 


{"type":"Feature","properties":{"name": "Moldova","color":"green","type": 
"Polygon"},"geometry":{"type": "Polygon","coordinates": 
[[[28.108325958251953,46.102291107177734],[28.0...]]]]}} 

Я думал о зацикливание на всех multipolygons и многоугольников и сделать массив многоугольников и массив массива полигонов, но это не сработало.

+0

Нет «карты», созданной вашим «полным» кодом. Пожалуйста, предоставьте [mcve], демонстрирующий вашу проблему. – geocodezip

+0

Хорошо, я обновил свой код, я забыл создание карты .. Я не поместил css для легенды и скрипта для ключа карты google. Мне не достаточно ясно о моей проблеме? – Florian

ответ

0

Я нашел ответ. Я обновляю ниже state.addListener:

state.addListener('addfeature',function(evt) { 

    var CouName = evt.feature.getProperty('name'); 
    if (evt.feature.getProperty('type') == 'Polygon') { 
     var c = p; 
     var ga = state.getFeatureById(CouName); 
     var gaGeom = ga.getGeometry(); 
     gaArr = gaGeom.getAt(0).getArray(); 
     //here I push all my polygons in my array poly 
     poly.push(new google.maps.Polygon({paths:gaArr, map:map,clickable:false,visible:false})); 
     google.maps.event.addListener(poly[c],'dblclick',function(evt){ 
     alert(poly.length); 
     if (google.maps.geometry.poly.containsLocation(evt.latLng, poly[c])) { 
     legend.innerHTML = CouName; 
     } 
     }); 

    google.maps.event.addListener(map,'mousemove',function(evt){ 
     if (google.maps.geometry.poly.containsLocation(evt.latLng, poly[c])) { 
     infoWindow.innerHTML = CouName; 
     } 
    }); 
    p++; 

    } 

     if (evt.feature.getProperty('type') == 'MultiPolygon') { 

     var cp= mp; 


     var ga = state.getFeatureById(CouName); 
     var gaGeom = ga.getGeometry(); 
     gaArr = gaGeom.getArray(); 

     for (var i=0;i<gaGeom.getArray().length;i++){ 
     //here I push all my polygons of my multipolygons in my array polys 
     polys.push(new google.maps.Polygon({paths:gaArr[i].getAt(0).getArray(), map:map,clickable:false,visible:false})); 
     } 

     google.maps.event.addListener(map,'dblclick',function(evt){ 

    for(var i=cp;i<cp+gaGeom.getArray().length;i++){ 

     if (google.maps.geometry.poly.containsLocation(evt.latLng, polys[i])) { 
     legend.innerHTML = CouName; 
     } 
     } 
     }); 

    google.maps.event.addListener(map,'mousemove',function(evt){ 
    for (var i=cp;i<cp+gaGeom.getArray().length;i++){ 
     if (google.maps.geometry.poly.containsLocation(evt.latLng, polys[i])) { 
     infoWindow.innerHTML = CouName; 
     } 
     } 
     }); 
    mp=mp+gaGeom.getArray().length; 
    } 
    }); 
Смежные вопросы