Ionic with angular-google-maps指令
Ionic with angular-google-maps指令
提问于 2015-05-16 02:43:35
我一直在尝试让angular-google-maps上线并运行起来，对于我的一生，我都不能确定它为什么不能工作……
首先，我安装
cordova plugin add cordova-plugin-geolocation这是索引html
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- google maps javascript -->
<script src='//maps.googleapis.com/maps/api/js?sensor=false'></script>
<script src="lib/lodash/dist/lodash.min.js"></script>
<script src="lib/angular-google-maps/dist/angular-google-maps.min.js"></script>
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>我的map.html
<ion-view view-title="Map">
<ion-content ng-controller="MapCtrl">
<ui-gmap-google-map center='map.center' zoom='map.zoom'></ui-gmap-google-map>
</ion-content>
</ion-view>最后是我的模块和控制器
var myApp = angular.module('myApp', ['ionic','uiGmapgoogle-maps']);
myApp.controller('MapCtrl', function($scope) {
$scope.map = { center: { latitude: 45, longitude: -73 }, zoom: 8 };
});在chrome浏览器和android手机上运行此命令时，都会出现空白屏幕。你知道我可能做错了什么吗？感谢您的关注
因此，在将谷歌依赖项移动到ionic.bundle下面之后，地图现在会加载...但是，我无法使用以下命令将高度设置为100%
.angular-google-map-container {
height: 100%;
}有什么想法吗？
回答 2
Stack Overflow用户
发布于 2015-05-20 04:17:35
尝尝这个。
<map center="{{latitud}}, {{longitud}}" zoom="12" id="map_views" data-tap-disabled="true"></map>Stack Overflow用户
发布于 2015-05-20 04:20:54
<script src="lib/angular-google-maps/dist/angular-google-maps.min.js"></script>应在ionic之后加载，因为离子束包括angular框架
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30266642
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号