[OpenLayers-Users] GWT-OpenLayers plugin

[Erdem Gunay]

Hi everyone, 

One week ago, I was looking for a way of using OpenLayers in my GWT (Google Web Toolkit) based map application. However, I could not find any valuable resource and I decided to develop my own.

I decided to put this plugin on sourceforge so that other developers may want to use it as I did. hope it helps. Although it is not supporting all the OpenLayers classes / functions, it's in a good shape to start with. 

here is the link : http://sourceforge.net/projects/gwt-openlayers/

here is an example GWT module :

------------------------
import com.google.gwt.user.client.ui.Widget;
import com.eg.gwt.openLayers.client.Icon;
import com.eg.gwt.openLayers.client.JObjectArray;
import com.eg.gwt.openLayers.client.JSObject;
import com.eg.gwt.openLayers.client.LonLat;
import com.eg.gwt.openLayers.client.Map;
import com.eg.gwt.openLayers.client.MapOptions;
import com.eg.gwt.openLayers.client.MapWidget;
import com.eg.gwt.openLayers.client.Marker;
import com.eg.gwt.openLayers.client.Pixel;
import com.eg.gwt.openLayers.client.Size;
import com.eg.gwt.openLayers.client.control.LayerSwitcher;
import com.eg.gwt.openLayers.client.control.MousePosition;
import com.eg.gwt.openLayers.client.control.MouseToolbar;
import com.eg.gwt.openLayers.client.control.PanZoomBar;
import com.eg.gwt.openLayers.client.control.Scale;
import com.eg.gwt.openLayers.client.event.EventHandler;
import com.eg.gwt.openLayers.client.layer.Canvas;
import com.eg.gwt.openLayers.client.layer.Google;
import com.eg.gwt.openLayers.client.layer.Layer;
import com.eg.gwt.openLayers.client.layer.Markers;
import com.eg.gwt.openLayers.client.layer.WMS;
import com.eg.gwt.openLayers.client.layer.WMSParams;
import com.eg.gwt.openLayers.client.popup.AnchoredBubble;
import com.eg.gwt.openLayers.client.popup.Popup;

public class MapViewerOpenLayers {

 private MapWidget mapWidget;
 private Map map;
 private WMS wmsLayer;
 private Markers markers;
 private Popup popup;

 public MapViewerOpenLayers() {
  // let's create the Map options
  MapOptions mapOptions = new MapOptions();
  mapOptions.setControls(new JObjectArray(new JSObject[] {}));
  mapOptions.setNumZoomLevels(18);
  mapOptions.setProjection("EPSG:4326");
  
   
  // let's create the Map widget and map object
  mapWidget = new MapWidget("300px", "300px", mapOptions);
  map = mapWidget.getMap();
  markers = new Markers("markers");

  // let's create the WMS layer
  WMSParams wmsParams = new WMSParams();
  wmsParams.setLayers("some_layers");
  wmsParams.setStyles("some_shapes");
  wmsLayer = new WMS("WMS Layer", "http://localhost:8080/geoserver/wms", wmsParams);
  
  map.addLayers(new Layer[] {wmsLayer, markers});

  // center a point and add other controls
  LonLat center = new LonLat(37.38, 37.06);
  map.setCenter(center, 13);
  map.addControl(new PanZoomBar());
  map.addControl(new MouseToolbar());
  map.addControl(new LayerSwitcher());
  map.addControl(new MousePosition());
  map.addControl(new Scale());

  // let's create a marker and add an event handler
  Size size = new Size(10,17);
  Pixel offset = new Pixel(-5, -17);
  Icon icon = new Icon("img/marker.png", size, offset);
  Marker marker = new Marker(center, icon);
  markers.addMarker(marker);

  marker.getEvents().register("mouseover", marker, new EventHandler() {
   public void onHandle(JSObject source, JSObject[] param) {
    Marker mrk = Marker.narrowToMap(source);
    if (popup != null)
     map.removePopup(popup);
        
    popup = new AnchoredBubble("marker-info", 
       mrk.getLonLat(),
       new Size(200,100),
       "test popup",
       new Icon("", new Size(0,0), new Pixel(0,0)),
       true);
    map.addPopup(popup);
   }
  });
 }

}
------------------------

Erdem Gunay


       
____________________________________________________________________________________
Looking for a deal? Find great prices on flights and hotels with Yahoo! FareChase.
http://farechase.yahoo.com/