javascript - Google マップと DART

Question

DART初心者です。DART で Google Maps Javascript API を使用することはできますか? 今すぐ直接不可能な場合、他の代替方法はありますか?

Answer 1

pubで入手できるgoogle_mapsパッケージを使用できるようになりました。このライブラリを使用すると、dart スクリプトから Google Maps JavaScript API を使用できます。

依存関係をpubspec.yamlに追加するだけです

dependencies:
  google_maps: ">=1.0.1 <2.0.0"

<script>タグを使用して Maps API JavaScript を含めます。

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

その後、dart スクリプトから Google マップを使用できます。簡単な例を次に示します。

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);
}

Answer 2

現在、JavaScriptと通信する場合は、DartのpostMessageを使用する必要があります（これは最終的に変更されます）。したがって、今のところ、GoogleマップJSAPIとDartとの間のメッセージを仲介するJavaScriptコードをアプリに追加する必要があります。

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

そして、ダートコードで：

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

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

または、XMLHttpREquestを使用してDartから直接Google MapsRESTAPIを使用できます。

Answer 3

Dart には JavaScript 相互運用ライブラリがあります: http://www.dartlang.org/articles/js-dart-interop/

そのページの例の 1 つは、Google Apps と相互運用する方法です。