I’m trying to use OpenLayers in native Javascript with Vaadin. For that, I added the following code:
contentLayout.addComponent(mapLayout);
mapLayout.setDebugId("map");
window.executeJavaScript("window.onload = function(){"
+ "alert('hi');"
+ "map = new OpenLayers.Map ('map');"
+ "var osm = new OpenLayers.Layer.OSM();"
+ "map.addLayers([osm]
);" + "map.zoomToMaxExtent();"
+ "alert('bye');"
+ "};");
All I get in the output window is an empty layout with “hi” and “bye” notifications.
I did not add a with reference to the API because I noticed (using firebug) that the API script is added to the DOM of the HTML page, I suppose by the OpenLayers Vaadin add-on that I have installed in the application.
In my opinion you need to set a extent in Javascript (or call setCenter and setZoom).
Why do you want to use the pure Javascript instead of the add-on. I also play around with it and try to learn
If you included the vaadin add-on there is no need to do this in pure javascript. I load my map with code like this … it’s from Demo.java from add-on source
...
final OpenLayersMap map = new OpenLayersMap();
map.setImmediate(true); // update extent and zoom to server as they
// change
OpenStreetMapLayer osm = new OpenStreetMapLayer();
map.setSizeFull();
map.addLayer(osm);
map.setCenter(22.805, 60.447);
map.setZoom(15);
...
I don’t think that’s the problem. In my code, there is a zoomToMaxExtent() method that replaces the setCenter() and setZoom() methods.
Besides, that code works fine in a classic html/ javascript application.
Well, I want to use javascript because I’m more fluent using javascript OpenLayers and because I’d like to use other libraries like GeoExt, ExtJs… And also because I can’t even display a simple Geoserver WMS using Vaadin add-on …