Fac*_*ari 1 javascript google-maps google-maps-api-3 angularjs angularjs-google-maps
嗨,我正在尝试使用angularjs开发一个应用程序和我发现的实例GMaps指令:http://nlaplante.github.io/angular-google-maps/#!/usage .我遵循所有步骤,但我无法渲染地图!它没有返回任何错误!救命!!
在HTML中
<html ng-app="Maptesting">
<google-map center="center"
zoom="zoom"
markers="markers"
refresh="!isMapElementHidden"
style="height: 400px; width: 100%; display: block;">
</google-map>
<div ng-view></div>
<script type="text/javascript" src="js/angular/angular.js"></script>
<script src="http://code.angularjs.org/1.2.0-rc.2/angular-route.min.js"></script>
<script type="text/javascript" src="js/angular-google-maps.js"></script>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false&language=en"></script>
<script src="app/map.js">
</script>
在控制器中:
angular.module('Maptesting', ['google-maps'])
.controller('CtrlGMap', ['$scope', function($scope) {
$scope.center = {
latitude: 45,
longitude: -73
};
$scope.markers = [];
$scope.zoom = 8;
}])
不同的答案,但我觉得google-maps-directive更难以使用.因此,我为我自己的项目创建了一个名为ng-map 的谷歌地图angularjs指令.这不需要任何Javascript编码来实现简单的功能.
它看起来像这样
<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" />
</map>
我有这个问题.解决方案是确保在CSS中包含"angular-google-map-container"类的高度值.您不必将此类添加到HTML中; 它已包含在angular-google-maps指令的Javascript中.将高度添加为内联样式将不起作用,因为通过在指令中进行转换添加了此特定类.
.angular-google-maps-container {
height: 400px;
}
| 归档时间： |
|
| 查看次数： |
14576 次 |
| 最近记录： |