Как интегрировать карту OpenLayers в диалоге jQuery-ui? - PullRequest
2 голосов
/ 14 сентября 2011

У меня есть веб-страница с картой Openlayer.Когда пользователь нажимает на маркер, открывается диалоговое окно jquery-ui, в котором отображается некоторая информация, поступающая от вызова ajax.Я также хотел бы показать небольшую карту открытых слоев, центрированную вокруг маркера, на который нажали.

Проблема возникает при попытке встроить карту в диалог.

Каков правильный порядок операций:

  • карта инициализации OL
  • объявление диалогового окна jquery
  • открытое диалоговое окно jquery

спасибо

alberto

1 Ответ

3 голосов
/ 21 августа 2012

вот мое (рабочее) решение:

// create map container (id=map) and append to document body
var div = $('<div />')
            .attr('id', 'map').
            css({width:400,height:400})
            .appendTo($('body'));

//start a simple map, code from on http://openlayers.org/dev/examples/osm.html
map = new OpenLayers.Map( 'map');
layer = new OpenLayers.Layer.OSM( "Simple OSM Map");
map.addLayer(layer);
map.setCenter(
    new OpenLayers.LonLat(-71.147, 42.472).transform(
        new OpenLayers.Projection("EPSG:4326"),
        map.getProjectionObject()
        ), 12
    );

// initialize the jQueryUI Dialog
div.dialog({
    width:800,
    height:600,
    title: 'My Map',
    resizeStop: function(){
        map.updateSize(); //to prevent drag-zoom error
    },
    dragStop: function(){
        map.updateSize(); //to prevent drag-zoom error
    });
...