arist1213 发表于 2015-8-9 01:52:53

又是一个百度地图问题。

本帖最后由 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;
}
第一个地图可以正确显示,但是第二个地图出现了下面的错误:



烦请各位给个帮助和提示,谢谢,谢谢。



arist1213 发表于 2015-8-9 02:48:44

我换了高德地图,好像没有这个问题,果断换掉SDK。
页: [1]
查看完整版本: 又是一个百度地图问题。