又是一个百度地图问题。
本帖最后由 arist1213 于 2015-8-9 02:00 编辑小弟使用ionic开发一个项目,主要是用到了百度地图的JS SDK,我想在同一个controller里,不同的modal,初始化不同的百度地图实例,但是有个错误,这是我的 services.
angular.module('Services', []).factory("BMService",
function(LogService) {
var map = [];
// 启动地图
var initMap = function(id, point, options) {
LogService.log("begin initialize map " + id, 1);
if (map) {
return;
} else {
map = new BMap.Map(id);
}
var color = options.color ? options.color: "rgb(177, 208, 0)";
var point = new BMap.Point(point.lng, point.lat);
map.centerAndZoom(point, 15);
//设置marker图标为水滴
if (options.marker) {
var vectorMarker = new BMap.Marker(new BMap.Point(point.lng, point.lat), {
// 指定Marker的icon属性为Symbol
icon: new BMap.Symbol(BMap_Symbol_SHAPE_POINT, {
scale: 1.2,
//图标缩放大小
fillColor: color,
//填充颜色
fillOpacity: 0.9 //填充透明度
})
});
map.addOverlay(vectorMarker);
}
//创建圆
if (options.circle) {
var circle = new BMap.Circle(new BMap.Point(point.lng, point.lat), 400, {
strokeColor: "blue",
strokeWeight: 2,
strokeOpacity: 0.5
});
circle.setFillColor(color);
circle.setFillOpacity(0.2);
circle.setStrokeColor(color);
map.addOverlay(circle); //增加圆
}
LogService.log("finish initialize map " + id, 1);
};
return {
initMap: initMap
};
})
同一个controller的调用:
$scope.$on('$ionicView.beforeEnter',function(){
BMService.initMap('mainMap',{lng:116.404, lat:39.915},{marker: true, circle: true});
BMService.initMap('allObjectMap',{lng:114.045, lat:22.532},{marker: true, circle: true});
$scope.initObject();
});
地图在不同的modal里,
<script id="home.html" type="text/ng-template">
<div id="mainMap" class="baidu_map"></div>
</script>
<script id="user.html" type="text/ng-template">
<div id="allObjectMap" class="baidu_map"></div>
</script>
地图的样式:
.baidu_map {
width: 100%;
height: 100%;
overflow: hidden;
margin: 0;
}
第一个地图可以正确显示,但是第二个地图出现了下面的错误:
烦请各位给个帮助和提示,谢谢,谢谢。
我换了高德地图,好像没有这个问题,果断换掉SDK。
页:
[1]