Hi I'm trying to create a custom popup overlay using Openlayers 3 and Jquery UI dialog boxes. (I want use the dialog box as a popup window).
I'm a bit stuck though as my Jquery coding isn't good. I was wondering if anyone has done this already, and if so could they point me in the right direction? The code I have so far is:
var map = new ol.Map({ target: 'map', layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({ center: ol.proj.transform([-0.06, 51.55], 'EPSG:4326', 'EPSG:3857'), zoom: 13 }) }); map.on('click', function(evt) { var popup = document.getElementById('popupContainer'); popup.innerHTML= "Hello
"; var coordinate = evt.coordinate; $(function() { $( "#dialogTest" ).dialog({ //autoOpen: false, minWidth: 200, minHeight: 200 position: {'within'
opup} } ); }); var overlay = new ol.Overlay({ elementopup }); overlay.setPosition(coordinate); map.addOverlay(overlay); popup.style.display = 'block'; $( "#dialogTest" ).dialog( "open" ); });Thanks very much for your help.
أكثر...
I'm a bit stuck though as my Jquery coding isn't good. I was wondering if anyone has done this already, and if so could they point me in the right direction? The code I have so far is:
var map = new ol.Map({ target: 'map', layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({ center: ol.proj.transform([-0.06, 51.55], 'EPSG:4326', 'EPSG:3857'), zoom: 13 }) }); map.on('click', function(evt) { var popup = document.getElementById('popupContainer'); popup.innerHTML= "Hello
"; var coordinate = evt.coordinate; $(function() { $( "#dialogTest" ).dialog({ //autoOpen: false, minWidth: 200, minHeight: 200 position: {'within'
opup} } ); }); var overlay = new ol.Overlay({ elementopup }); overlay.setPosition(coordinate); map.addOverlay(overlay); popup.style.display = 'block'; $( "#dialogTest" ).dialog( "open" ); });Thanks very much for your help. أكثر...