帶openstreetmap示例的gwt-openlayers示例

Question

我想將OSM集成到GWT中。 我發現這個名爲gwt-openlayers的庫，但我不明白我怎樣才能使它與OSM地圖一起工作。

任何人都可以提供一個簡短的例子嗎？

Answer 1

務必從GWT-的OpenLayers繼承通過添加以下到您的模塊文件：

<inherits name='org.gwtopenmaps.openlayers.OpenLayers'/>

另外，還要確保你在的OpenLayers JavaScript庫和OpenStreetMap的的OpenLayers到通過添加下面的應用程序帶來

<script src="http://www.openlayers.org/api/OpenLayers.js"></script>

<script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>

：在 「Application.html」 頁面線

，那麼它應該一件簡單的事情，以創建一個使用開放街道地圖圖層：

OSM openStreetMap = OSM.Osmarender("Base Map"); openStreetMap.setIsBaseLayer(true);

MapWidget mapWidget = new MapWidget("350px", "350px"); mapWidget.getMap().addLayer(openStreetMap);

Answer 2

GWT-的OpenLayers HelloWorld與OpenStreetMap的

的以下示例適用於我使用OpenLayers-2.8/OpenLayers.js和OpenStreetMap.js如上所述：

公共無效onModuleLoad（）{

MapOptions defaultMapOptions = new MapOptions(); 
MapWidget mapWidget = new MapWidget("800px", "600px", defaultMapOptions); 

OSM osm_1 = OSM.Osmarender("Osmarender"); // Label for menu 'LayerSwitcher' 
    osm_1.setIsBaseLayer(true); 

OSM osm_2 = OSM.Mapnik("Mapnik"); // Label for menu 'LayerSwitcher' 
    osm_2.setIsBaseLayer(true); 

OSM osm_3 = OSM.CycleMap("CycleMap"); 
    osm_3.setIsBaseLayer(true); 

OSM osm_4 = OSM.Maplint("Maplint"); 
    osm_4.setIsBaseLayer(true); 

Map map = mapWidget.getMap(); 
    map.addLayer(osm_1); 
    map.addLayer(osm_2); 
    map.addLayer(osm_3); 
    map.addLayer(osm_4); 
    map.addControl(new LayerSwitcher()); 
    map.addControl(new MousePosition()); 

// map.setCenter(new LonLat(6.95, 50.94), 12);   // Warning: In the case of OSM-Layers the method 'setCenter()' uses Gauss-Krueger coordinates, 
                  //   thus we have to transform normal latitude/longitude values into this projection first: 
    LonLat lonLat = new LonLat(6.95, 50.94);    //   (6.95, 50.94) --> (773670.4, 6610687.2) 
      lonLat.transform("EPSG:4326", "EPSG:900913"); //   
    map.setCenter(lonLat, 12);        //   see http://docs.openlayers.org/library/spherical_mercator.html 

RootPanel.get().add(mapWidget); } 

Answer 3

你發現GWT-的OpenLayers這裏的當前版本：http://sourceforge.net/projects/gwt-openlayers/