用于 AngularJS 的谷歌地图 [英] Google maps for AngularJS
问题描述
我对 AngularJS 很陌生,我正在尝试使用 https://github.com/angular-ui/angular-google-maps.
I am very new to AngularJS and I am trying to use https://github.com/angular-ui/angular-google-maps.
我只是想让地图在我的页面上呈现,但我收到一条错误消息,我不知道这意味着什么.任何有助于理解此错误消息的帮助将不胜感激.
I am just trying to get the map to render on my page but I am getting an error message and I don't know what it means. Any help with understanding this error message would be appreciated.
我在这里创建了一个 plunk:
I've created a plunk here:
github.com/twdean/plunk
这是浏览器中的错误:
Error: [$compile:multidir] Multiple directives [googleMap, markers] asking for new/isolated scope on: <google-map center="center" draggable="true" zoom="zoom" markers="markers" mark-click="true" style="height: 400px">
http://errors.angularjs.org/1.2.3/$compile/multidir?p0=googleMap&p1=markers&p2=new%2Fisolated%20scope&p3=%3Cgoogle-map%20center%3D%22center%22%20draggable%3D%22true%22%20zoom%3D%2
推荐答案
我建议另一种选择,ng-map.
I suggest another alternative, ng-map.
我为我自己的项目创建了一个名为 ng-map 的 谷歌地图 angularjs 指令.这不需要任何 Javascript 编码来实现简单的功能.
I created a google maps angularjs directive called, ng-map, for my own project. This does not require any Javascript coding for simple functionality.
一个.下载并包含 ng-map.js 或 ng-map.min.js
One. Download and include ng-map.js or ng-map.min.js
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="dist/ng-map.min.js"></script>`
两个.使用 map
标签,以及可选的 control
、marker
和 shape
标签
Two. use map
tag, and optionally, control
, marker
, and shape
tags
<ng-map zoom="11" center="[40.74, -74.18]">
<marker position="[40.74, -74.18]" />
<shape name="circle" radius="400" center="[40.74,-74.18]" radius="4000" />
<control name="overviewMap" opened="true" />
</ng-map>`
要在您的应用中使用它,只需将ngMap"作为您应用的依赖项.
To use it in your app, simply include 'ngMap' as dependency to your app.
var myApp = angular.module('myApp', ['ngMap']);
希望能帮到你
-------------- 编辑-------------------
-------------- EDIT -------------------
对于那些寻找 angular2 版本的人,
还有 ng2-map
https://ng2-ui.github.io/#/google-map
For those who looks for angular2 version,
there is also ng2-map
https://ng2-ui.github.io/#/google-map
这篇关于用于 AngularJS 的谷歌地图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!