OpenLayers 3 map.getLayers() 失败
OpenLayers 3 map.getLayers() failing
我正在尝试构建图层切换器,我正处于需要获取地图的所有图层的位置,所以我正在使用...
// array with layers:
var layers = map.getLayers().getArray();
但是我收到了错误消息 "map.getLayers is not a function"
我正在使用 OL3 3.16...非常感谢任何帮助!!
这是我的地图...
<div class="col-md-12" id="map" style="padding-top: 0px; width: 100vw; height: 90vh;z-index: 0"></div>
这里是我实例化地图的地方...
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({ layer: 'sat' })
})
//,layer
],
view: new ol.View({
projection: 'EPSG:4326',
center: [0, 0],
zoom: 0,
})
});
使用 AngularJS 我需要在创建地图的控制器中创建一个地图对象...
angular.module('webMapAPI.LoadMap', [
...load objects
])
.factory('WebMapLoad', WebMapLoadFactory);
WebMapLoadFactory.$inject = ['$parse', '$state', '$stateParams','$q'];
function WebMapLoadFactory($parse, $state, $stateParams,$q) {
function WebMapLoad() {
this.map = new ol.Map({});
}
然后在同一个控制器的 "LoadMap" 函数中...(就像我决定这样做的方式)...分配给 $scope 对象映射...
WebMapLoad.prototype.LoadMap = function () {
var control = this; (in angular sometimes you need to pull the main controllers $scope object in)
control.map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({ layer: 'sat' })
})
//,layer
],
view: new ol.View({
projection: 'EPSG:4326',
center: [0, 0],
zoom: 0,
})
});
}
一旦我这样做了,我就可以访问我注入 "WebMapLoad" 的每个控制器中的地图。
*声明以上代码为伪代码,未经测试
该解决方案的另一项功能是获得对图层的访问权限并能够操纵它们的属性。我就是这样做的,看起来很干净...(WebMapLoad 是我用来创建地图的 AngularJS 模块)
$scope.setVisibility = function (layer) {
angular.forEach(WebMapLoad.map.getLayers().getArray(), function (Field, key) {
if(layer.get('id') == Field.get('id'))
{
if (layer.U.visible) {
Field.setVisible(false);
}
else {
Field.setVisible(true);
}
}
}
)}
我正在尝试构建图层切换器,我正处于需要获取地图的所有图层的位置,所以我正在使用...
// array with layers:
var layers = map.getLayers().getArray();
但是我收到了错误消息 "map.getLayers is not a function"
我正在使用 OL3 3.16...非常感谢任何帮助!!
这是我的地图...
<div class="col-md-12" id="map" style="padding-top: 0px; width: 100vw; height: 90vh;z-index: 0"></div>
这里是我实例化地图的地方...
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({ layer: 'sat' })
})
//,layer
],
view: new ol.View({
projection: 'EPSG:4326',
center: [0, 0],
zoom: 0,
})
});
使用 AngularJS 我需要在创建地图的控制器中创建一个地图对象...
angular.module('webMapAPI.LoadMap', [
...load objects
])
.factory('WebMapLoad', WebMapLoadFactory);
WebMapLoadFactory.$inject = ['$parse', '$state', '$stateParams','$q'];
function WebMapLoadFactory($parse, $state, $stateParams,$q) {
function WebMapLoad() {
this.map = new ol.Map({});
}
然后在同一个控制器的 "LoadMap" 函数中...(就像我决定这样做的方式)...分配给 $scope 对象映射...
WebMapLoad.prototype.LoadMap = function () {
var control = this; (in angular sometimes you need to pull the main controllers $scope object in)
control.map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({ layer: 'sat' })
})
//,layer
],
view: new ol.View({
projection: 'EPSG:4326',
center: [0, 0],
zoom: 0,
})
});
}
一旦我这样做了,我就可以访问我注入 "WebMapLoad" 的每个控制器中的地图。
*声明以上代码为伪代码,未经测试
该解决方案的另一项功能是获得对图层的访问权限并能够操纵它们的属性。我就是这样做的,看起来很干净...(WebMapLoad 是我用来创建地图的 AngularJS 模块)
$scope.setVisibility = function (layer) {
angular.forEach(WebMapLoad.map.getLayers().getArray(), function (Field, key) {
if(layer.get('id') == Field.get('id'))
{
if (layer.U.visible) {
Field.setVisible(false);
}
else {
Field.setVisible(true);
}
}
}
)}