不能动态传递角谷歌-maps地图风格(Cannot pass dynamically map sty

2019-10-22 13:13发布

我有一个问题。 我从服务动态获取的风格。 风格是数组,检查在线添加,当所有的工作确定,但是当我动态获取数据的地图呈现的默认样式。

例如,以下是我的代码:

 var styleArray = data.settings.Theme.mapSelected;
 if(data.settings.Theme.mapSelected != undefined) {
    $scope.mapOptions = {
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      mapTypeControl: false,
      styles: styleArray
    };
 } else {
    $scope.mapOptions = {
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: false,
    styles: [{"featureType":"landscape","stylers":[{"saturation":-100},{"lightness":65},{"visibility":"on"}]},{"featureType":"poi","stylers":[{"saturation":-100},{"lightness":51},{"visibility":"simplified"}]},{"featureType":"road.highway","stylers":[{"saturation":-100},{"visibility":"simplified"}]},{"featureType":"road.arterial","stylers":[{"saturation":-100},{"lightness":30},{"visibility":"on"}]},{"featureType":"road.local","stylers":[{"saturation":-100},{"lightness":40},{"visibility":"on"}]},{"featureType":"transit","stylers":[{"saturation":-100},{"visibility":"simplified"}]},{"featureType":"administrative.province","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"labels","stylers":[{"visibility":"on"},{"lightness":-25},{"saturation":-100}]},{"featureType":"water","elementType":"geometry","stylers":[{"hue":"#ffff00"},{"lightness":-25},{"saturation":-97}]}]
                    };
                  }

在这里,我的HTML

<ui-gmap-google-map center='settings.Location.coords' zoom='12' options='mapOptions' doRebuildAll="true">
    <ui-gmap-marker idKey='settings.Content._id' coords='settings.marker.coords'></ui-gmap-marker>
</ui-gmap-google-map>

我得到正确的数据,我可以在检查看到,当我登录到控制台,但地图没有绘制选定样式数组,但谷歌的默认。

有任何想法吗?

PS:在if else语句可以正常工作,以及所有的选项,以及仅风格数组不是。

更新:如果我通过内嵌的动感风格阵列它的工作原理,只有具有可变事实并非如此。 我tryid来传递数据直接(data.settings.Theme.mapSelected),但它的一些事情。

Plnkr: http://plnkr.co/edit/KtvcIoqTaa9HHG5Xc1E6?p=preview

Answer 1:

嗯,这是很简单的...

由于数据是JSON角度没有被正确渲染信息,所以简单的解决方案是具有隐蔽数据angular.fromJson() 。

所以校正只需编辑这样导入的数据:

var styleArray = angular.fromJson(data.settings.Theme.mapSelected);

它会奏效。



文章来源: Cannot pass dynamically map style in angular-google-maps