Javascript 无法在角度谷歌地图中动态传递地图样式
我有个问题。 我正在从服务中动态获取样式。样式是数组,在内联添加时检查所有样式是否正常工作,但在动态获取数据时,贴图将呈现默认样式 例如,下面是我的代码:Javascript 无法在角度谷歌地图中动态传递地图样式,javascript,angularjs,google-maps,angular-google-maps,Javascript,Angularjs,Google Maps,Angular Google Maps,我有个问题。 我正在从服务中动态获取样式。样式是数组,在内联添加时检查所有样式是否正常工作,但在动态获取数据时,贴图将呈现默认样式 例如,下面是我的代码: var styleArray = data.settings.Theme.mapSelected; if(data.settings.Theme.mapSelected != undefined) { $scope.mapOptions = { mapTypeId: google.maps.MapTypeId.ROAD
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>
我得到了正确的数据,正如我登录控制台时在inspector中看到的那样,但map并没有呈现选定的样式数组,而是google的默认样式
有什么想法吗
备注:if-else语句工作正常,而且所有选项以及only样式数组都不正确
更新:如果我以内联方式传递动态样式数组,它将工作,只有变量不工作。我试图直接传递数据(data.settings.Theme.mapSelected),但它做了一些事情
Plnkr:这很简单 由于数据不正确,无法正确呈现信息,因此简单的解决方案是使用转换数据 因此,更正只需编辑导入的数据,如下所示:
var styleArray = angular.fromJson(data.settings.Theme.mapSelected);
它会起作用的