javascript - 谷歌地图和 DART

Question

我是飞镖的新手。是否可以在 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 （这最终会改变）。因此，现在您需要向您的应用程序添加一些 JavaScript 代码，以协调与 Google maps JS API 和 Dart 之间的消息：

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

然后在你的 Dart 代码中：

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 Maps REST API

Answer 3

Dart 现在有一个 JavaScript 互操作性库：http ://www.dartlang.org/articles/js-dart-interop/

该页面上的示例之一是如何与 Google Apps 进行互操作。