CODEWITHSUNDEEP
javascriptapigoogle-mapsgoogle-maps-api-3dart
18bytes
18bytes

Reputation: 6029

Google Maps and DART

I am new to DART. Is it possible to use Google Maps Javascript API on DART? If its not directly possible now, is there any other alternate way?

Upvotes: 10

Views: 2350

Answers (3)

Alexandre Ardhuin
Alexandre Ardhuin

Reputation: 76303

You can now use google_maps package available on pub. This library allows you to use Google Maps JavaScript API from dart scripts.

Simply add the dependency to your pubspec.yaml 

dependencies:
  google_maps: ">=1.0.1 <2.0.0"

Include the Maps API JavaScript using a <script> tag.

<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

Then you can use Google Maps from dart scripts. Here's a simple exemple :

import 'dart:html';
import 'package:google_maps/google_maps.dart';

void main() {
  final mapOptions = new MapOptions()
    ..zoom = 8
    ..center = new LatLng(-34.397, 150.644)
    ..mapTypeId = MapTypeId.ROADMAP
    ;
  final map = new GMap(query("#map_canvas"), mapOptions);
}

Upvotes: 8

Shannon -jj Behrens
Shannon -jj Behrens

Reputation: 5030

Dart now has a JavaScript interoperability library: http://www.dartlang.org/articles/js-dart-interop/

One of the examples on that page is how to interoperate with Google Apps.

Upvotes: 1

Lars Tackmann
Lars Tackmann

Reputation: 20865

Currently you need to use postMessage from Dart if you want to communicate with JavaScript (this will eventually change). So for now you'll need to add some JavaScript code to your app that mediates messages to and from Google maps JS API and Dart:

function googleMapsCallback(s) { 
   window.postMessage(JSON.stringify(s), '*'); 
}

And then in your Dart code:

class GoogleMap { 
  GoogleMap() {
     window.on.message.add(received, false); 
  }

  received(MessageEvent e) { 
    var data = JSON.parse(e.data); 
    // do stuff with google maps data 
  } 
}

Alternativly you can use Google Maps REST API directly from Dart using XMLHttpREquest

Upvotes: 2

Related Questions