Javascript 如何更改开放层平铺源?
我需要更改openlayer的层源代码(使用OpenWeatherAPI)。目前我正在使用以下代码,但没有成功Javascript 如何更改开放层平铺源?,javascript,openlayers,Javascript,Openlayers,我需要更改openlayer的层源代码(使用OpenWeatherAPI)。目前我正在使用以下代码,但没有成功 let layer = this.map.getLayers().getArray()[2] layer.setSource(forecastLayer) 你能告诉我我做错了什么吗? 更新数据源的正确方法是什么 renderMapOpenLayer(){ 让geo=this.props.geo //渲染标记向量 设markerFeature=新的ol.特征({ 几何体:新的ol.g
let layer = this.map.getLayers().getArray()[2]
layer.setSource(forecastLayer)
你能告诉我我做错了什么吗?
更新数据源的正确方法是什么
renderMapOpenLayer(){
让geo=this.props.geo
//渲染标记向量
设markerFeature=新的ol.特征({
几何体:新的ol.geom.Point(ol.proj.transform([-72.0704,46.678],'EPSG:4326','EPSG:3857'))//TODO//从openweather api获取lat long,该api应在该状态下进行排序
})
让markerSource=new ol.source.Vector({
特征:[markerFeature]
})
让markerStyle=new ol.style.style({
图片:新ol.style.Icon(({
主播:[0,0],
主播:“分数”,
anchorYUnits:'像素',
不透明度:0.75,
src:'assets/pin.svg'
}))
})
设markerLayer=new ol.layer.Vector({
资料来源:markerSource,
风格:markerStyle
})
//渲染OpenStreetMap平铺服务器
var tileLayer=新ol.layer.Tile({
来源:new ol.source.OSM()
},新的ol.layer.Vector({
source:newol.source.Vector({features:[],投影:'EPSG:4326'})
}))
//渲染云平铺
让cloudLayer=new ol.layer.Tile({
来源:new ol.source.XYZ({
url:api.mapTemperature()
})
})
让forecastLayer=新建ol.layer.Tile({
来源:new ol.source.XYZ({
url:api.forecast()
})
})
setTimeout(函数(){
让layer=this.map.getLayers().getArray()[2]
layer.setSource(预报层)
}.绑定(此),3000)
//创建地图
this.map=新ol.map({
目标:“地图”,
图层:[
蒂莱耶,
马克莱耶,
云层
],
视图:新ol.view({
中心:ol.proj.transform(地理位置,“EPSG:4326”,“EPSG:3857”),
缩放:4
})
})
}
layer.setSource应该可以做到这一点
function onClick() {
layer.setSource(xyz2);
}
var xyz1 = new ol.source.XYZ({
url: 'https://server.arcgisonline.com/ArcGIS/rest/services/' +
'Demographics/USA_Percent_Over_64/MapServer/tile/{z}/{y}/{x}'
})
var xyz2 = new ol.source.XYZ({
url: 'https://server.arcgisonline.com/ArcGIS/rest/services/' +
'Demographics/USA_Percent_Under_18/MapServer/tile/{z}/{y}/{x}'
})
var layer = new ol.layer.Tile({
source: xyz1
});
var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
}),
layer
],
target: 'map',
view: new ol.View({
center: ol.proj.fromLonLat([0, 0]),
zoom: 3
})
});
以下是一个工作示例: