Openlayers - маркер исчезает при масштабировании

0

Мне нужно, чтобы когда карта приближается/удаляется, не стирайте маркеры.

Мой сценарий таков:

Js

 $(document).ready(function() {
   //init 
   var map;
   var posMarcador; // Posicion del marcador

   var options = {
     restrictedExtent: extent,
     controls: [
       new OpenLayers.Control.Navigation(),
       new OpenLayers.Control.PanZoomBar(),
       new OpenLayers.Control.Attribution()
     ]
   };

   var position = new OpenLayers.LonLat(lon, lat).transform( fromProjection, toProjection);
   map = new OpenLayers.Map( 'map', options);
   layerBase = new OpenLayers.Layer.OSM();
   map.addLayer(layerBase);
   map.setCenter(extent.getCenterLonLat(), zoom);

   map.isValidZoomLevel = function(zoomLevel) {
     return ( (zoomLevel != null) &&
              (zoomLevel >= 11) && // set min level here, could read from property
              (zoomLevel < 17) );
   }

   var iconImage = //url image


   /**
    * Marcador
    * @type {OpenLayers.Layer.Markers}
    */
   var layerMarkers = new OpenLayers.Layer.Markers( "Markers" );
   map.addLayer(layerMarkers);

   map.events.register("click", map, function(e) {
     layerMarkers.clearMarkers();
     var position = map.getLonLatFromViewPortPx(e.xy);
     posMarcador = new OpenLayers.LonLat(position.lon, position.lat);
     var size = new OpenLayers.Size(50,50);
     var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
     var icon = new OpenLayers.Icon(iconImage(tipoIcono), size, offset);
     layerMarkers.addMarker(new OpenLayers.Marker(posMarcador, icon));
     posMarcador =   posMarcador.transform(toProjection  , fromProjection );
     $('input[name="geopunto.latitud"]').val(posMarcador.lat);
     $('input[name="geopunto.longitud"]').val(posMarcador.lon);
  });
});

Мое мнение таково:

<div id="map"></div>

Когда я помещаю статическую точку (незарегистрированное событие click), она работает правильно. Я надеюсь, что вы можете помочь.

Теги:
openstreetmap
openlayers

1 ответ

1
Лучший ответ

Вы сохраняете позицию своего нового маркера в posMarcador. Это следует использовать после того, как вы увеличили масштаб карты. Я сделал отдельную функцию для повторного использования для размещения маркера, в вашем случае это может быть что-то вроде:

function addNewMarker(pos) {
    posMarcador = pos;     // save pos

    var size = new OpenLayers.Size(50,50);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
    var icon = new OpenLayers.Icon(iconImage(tipoIcono), size, offset);

    layerMarkers.addMarker(new OpenLayers.Marker(posMarcador, icon));            

    var np = pos.transform(map.getProjectionObject(), new OpenLayers.Projection("EPSG:4326"));
    $('input[name="geopunto.latitud"]').val(np.lon.toFixed(6));
    $('input[name="geopunto.longitud"]').val(np.lat.toFixed(6));
}

Когда вы нажимаете маркер, вы можете:

map.events.register('click', map, function(ev) {
    layerMarkers.clearMarkers();
    var position = map.getLonLatFromViewPortPx(ev.xy);
    addNewMarker(position);
});

Теперь привяжите функцию к событию zoomend карты.

map.events.register('zoomend', map, function(ev){
    if (posMarcador != undefined) {
        var np = new OpenLayers.LonLat(posMarcador.lon, posMarcador.lat).transform(
            new OpenLayers.Projection("EPSG:4326"),  // from WGS 1984
            map.getProjectionObject()  // Spherical Mercator
        );
        addNewMarker(np);
    }
});

Для этого примера я использовал соответствующие проекции, такие как new OpenLayers.Projection("EPSG:4326") вместо переменных toProjection и fromProjection. Может быть, это помогает.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню