openlayers

[fils]

Are there examples of using opnelayers from Dart?

I'm curious if it's possible to roundtrip from openlayers back to Dart with things like lat long bounding box values or even things like feature selections from WFS layers.  

Are there some basic examples available to look at?

I know one would use js via "import 'package:js/js.dart' as js;" but I am having a hard time getting that to work.

Thanks

Doug

[Alan Humphrey]

I'm using OpenLayers extensively from Dart. Unfortunately I don't have any simple examples. I ended up writing Dart wrappers around a lot of the OpenLayers functionality I needed. Also, my interaction with the map is primarily to display data and detect when points are clicked (to display a popup). Getting a bounding box or a feature selection shouldn't be a problem, but I'm not doing it.

--
For other discussions, see https://groups.google.com/a/dartlang.org/
 
For HOWTO questions, visit http://stackoverflow.com/tags/dart
 
To file a bug report or feature request, go to http://www.dartbug.com/new

To unsubscribe from this group and stop receiving emails from it, send an email to misc+uns...@dartlang.org.

[fils]

Alan,

  Thanks..  it's good to know it works to a level and that there is a path.     Yea, getting the lat long values for a drawn box to pass back to dart for selections would be nice.  When I get some time I will try and take a stab at it.   Appreciate the message..

Take care

Doug

[fils]

Alan,  

   How does one even got ahold of the context correctly?   I'm new to the js package in Dart.  I can do things like:

js.scoped((){
    js.context.jQuery("#sandslider").bind("valuesChanged", new js.Callback.many((e, data) {
      getAndGo();
    }));

However, I don't see how to even get ahold of the context to do simple example like in this Javascript example: 

 var map = new OpenLayers.Map("map");

  var ol_wms = new OpenLayers.Layer.WMS(
      "OpenLayers WMS",

      "http://vmap0.tiles.osgeo.org/wms/vmap0",

      {layers: "basic"}

  );


  var dm_wms = new OpenLayers.Layer.WMS(

      "Canadian Data",

      "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",

      {

        layers: "bathymetry,land_fn,park,drain_fn,drainage," +

                "prov_bound,fedlimit,rail,road,popplace",

        transparent: "true",

        format: "image/png"

    },

    {isBaseLayer: false, visibility: false}

);


map.addLayers([ol_wms, dm_wms]);
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.zoomToMaxExtent();

On Monday, August 26, 2013 5:11:28 PM UTC-5, Alan Humphrey wrote:

[Alan Humphrey]

Here's an example of initializing a map that might help. It's the constructor of a class that manages the map, therefore there are some missing pieces (e.g. get_ol_controls). Let me know off-list if you need more.

TreeMap( this._config, [this.controls] ){

  map_div_id = _config['map_div'];

    var ol = js.context.OpenLayers;

    var restricted_extent = new js.Proxy(ol.Bounds, -13652354.432172, 6026153.418145, -13574082.915218, 6065289.1766216);

    var max_extent = restricted_extent;

    if (controls == null) {

      controls = [ MapControl.ATTRIBUTION,

                   MapControl.NAVIGATION,

                   MapControl.ARGPARSER,

                   MapControl.PANPANEL,

                   MapControl.ZOOMPANEL];

    }

    List ol_controls = get_ol_controls();

    var options = js.map ({

      'maxExtent': max_extent,

      'restrictedExtent' : restricted_extent,

      'units' : 'm',

      'projection': new js.Proxy(ol.Projection, 'EPSG:900913'),

      'displayProjection' : new js.Proxy(ol.Projection, 'EPSG:4326'),

      'controls' : ol_controls

    });

    _treemap = js.retain( new js.Proxy( ol.Map, map_div_id, options ) );

    List initial_layers = <MapType>[MapType.ROAD, MapType.HYBRID];

    _treemap.addLayers( js.array( get_ol_layers(initial_layers) ));

    _treemap.setBaseLayer(initial_layers[0]);

    _treemap.setCenter(new js.Proxy(ol.LonLat, map_center_lon, map_center_lat).transform(new js.Proxy(ol.Projection, "EPSG:4326"), _treemap.getProjectionObject()), start_zoom);

}

[Alexandre Ardhuin]

Here's the dart version (with js-interop) of your js code :

final map = new js.Proxy(js.context.OpenLayers.Map, "map");
final ol_wms = new js.Proxy(js.context.OpenLayers.Layer.WMS, 
  

"OpenLayers WMS",
  "http://vmap0.tiles.osgeo.org/wms/vmap0",

  js.map({'layers': "basic"})
);
final dm_wms = new js.Proxy(js.context.OpenLayers.Layer.WMS,

  "Canadian Data",
  "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",

  js.map({
    'layers': "bathymetry,land_fn,park,drain_fn,drainage,prov_bound,fedlimit,rail,road,popplace",

    'transparent': "true",
    'format': "image/png"

  }),
  js.map({'isBaseLayer': false, 'visibility': false})
);
map.addLayers(js.array([ol_wms, dm_wms]));
map.addControl(new js.Proxy(js.context.OpenLayers.Control.LayerSwitcher));
map.zoomToMaxExtent();

Cheers,
Alexandre

2013/8/28 fils <drf...@gmail.com>