谷歌地图和 DART答案

【问题标题】：Google Maps and DART谷歌地图和 DART
【发布时间】：2012-04-26 11:41:51
【问题描述】：

我是 DART 新手。是否可以在 DART 上使用 Google Maps Javascript API？如果现在不能直接实现，还有其他替代方法吗？

【问题讨论】：

18bytes，这个问题的答案变了。你介意移动绿色复选标记吗？谢谢！

标签： javascript api google-maps google-maps-api-3 dart

【解决方案1】：

您现在可以使用pub 上的google_maps package。该库允许您从 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);
}

【讨论】：

我试过了，但import 给了我一条错误消息“指令乱序”。任何线索为什么会这样做？
谢谢，但我坚持使用 13851，我想这就是问题所在。不过我找到了正确的语法：#import('package:js/js.dart', prefix: 'js');，可以帮助别人。
这就是最终对我有用的方法：groups.google.com/a/dartlang.org/d/msg/misc/ORXJmmmH3fA/…

【解决方案2】：

目前，如果你想与 JavaScript 通信，你需要使用 Dart 中的postMessage（这最终会改变）。因此，现在您需要向您的应用添加一些 JavaScript 代码，用于协调与 Google 地图 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

【讨论】：

谢谢。我最初只是考虑使用 Google Maps REST API。

【解决方案3】：

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

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

【讨论】：