我有一个带有 Openlayer map 的网页。当用户单击标记时,将打开一个 jquery-ui 对话框并显示来自 ajax 调用的一些信息。我还想显示一个以单击的标记为中心的小型 openlayers map 。
尝试将 map 嵌入对话框时出现问题。
正确的操作顺序是什么:
- 初始化OL map
- 声明 jquery 对话框
- 打开 jquery 对话框
谢谢
阿尔贝托
最佳答案
这是我的(工作)解决方案:
// 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
});
关于jquery-ui - 如何将 OpenLayers map 集成到 jQuery-ui 对话框中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7413791/