Cómo desencadenar eventos registrados en Openlayers?

Question

Estoy construyendo una aplicación web donde tengo que comparar 2 mapas diferentes de la misma zona, que necesito para los eventos en un mapa para que automáticamente se activará el otro mapa. Tengo hasta el momento: map2.eventos.triggerEvent(evt.tipo de evt.px);

estos chicos han hecho un mapa comparar: http://tools.geofabrik.de/mc/?lon=29.53125&lat=22.26877&zoom=2

pero no tengo idea de arco que logra este evento de manipulación..

por favor ayuda, necesito esta funcionalidad tan pronto Como sea posible, ha sido una semana estoy luchando con esta..agradezco todas las respuestas.

Answer 1

¿Necesita sincronizar solamente el movimiento y el zoom de mapa?

En ese caso, una solución es simple: escuchar moveend evento en el mapa y, a continuación, zoom otro mapa a la extensión de mapa actual.

map1 = new OpenLayers.Map('map1');
map2 = new OpenLayers.Map('map2');

map1.events.on({
    moveend: function(evt) {
        map2.zoomToExtent(map1.getExtent());

    }       
});

map2.events.on({
    moveend: function(evt) {
        map1.zoomToExtent(map2.getExtent());
    }       
});    

Aquí está el violín: http://jsfiddle.net/LwPEd/2/

Me hizo sentir miedo en primer lugar, que hay un bucle infinito, cuando zoomToExtent desencadena nuevo evento, pero funciona. Tengo que pensar, por qué :)

Answer 2

También es posible hacer la retroalimentación instantánea, a costa de complicar el código un poco (y con potencial de causar problemas de rendimiento si hay otros eventos adjuntos a los mapas):

(usado user1702401 la respuesta y el Violín como una plantilla - gracias)

var mapFollow = function(mapA, mapB) {
    var syncMapHandler = function() {
        var aCenter = mapA.getCenter();
        var bCenter = mapB.getCenter();

        var coordsChanged = ((aCenter.lat !== bCenter.lat) ||
            (aCenter.lon !== bCenter.lon));

        if (coordsChanged) {
            mapB.moveTo(mapA.getCenter(), mapA.getZoom(), {
                dragging: true
            });
        }
    };

    mapA.events.on({
        'move': syncMapHandler,
        'zoomend': syncMapHandler,
        scope: this
    });
};

map1 = new OpenLayers.Map('map1');
map2 = new OpenLayers.Map('map2');

mapFollow(map1, map2);
mapFollow(map2, map1);

Vivo ejemplo aquí: http://jsfiddle.net/4Wf7W/5/