我刚开始使用OpenLayers 3,我正在尝试用坐标动态更新一个功能几何属性,很明显,我遗漏了一些东西,因为这个特性没有移动。到目前为止,我的神是这样的:
Socket.IO
socket.on('mapData', function(mapData) {
if (mapisloaded) {
latLon = ol.proj.transform([mapData.lon, mapData.lat], 'EPSG:4326', 'EPSG:3857');
// Initiate latlong object with mapData
if (centerIsRequested) {
//Center map with mapData
};
// Update marker with latlong from mapData
};
});
基于OpenLayers 3的矢量图标实例
var latLon = ol.proj.transform([10.904108, 59.788187], 'EPSG:4326', 'EPSG:3857');
var iconFeature = new ol.Feature({
geometry: new ol.geom.Point(latLon),
name: 'Null Island',
population: 4000,
rainfall: 500
});
var iconStyle = new ol.style.Style({
image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
anchor: [0.5, 46],
anchorXUnits: 'fraction',
anchorYUnits: 'pixels',
opacity: 0.75,
src: 'imgs/lc.png'
}))
});
iconFeature.setStyle(iconStyle);
var vectorSource = new ol.source.Vector({
features: [iconFeature]
});
var vectorLayer = new ol.layer.Vector({
source: vectorSource
});
var baseLayer = new ol.layer.Tile({
source: new ol.source.OSM()
});
var view = new ol.View({
center: latLon,
zoom: 18,
});
var map = new ol.Map({
target: 'map-canvas',
layers: [ baseLayer, vectorLayer ],
view: view
});
这些变化显然没有改变,但我知道魔法并不存在--它只是从一开始就放下了一些东西。
如何继续完成这个简单的任务?我唯一想要的是,当socket.io检测到新的地图数据(mapData.lat,mapData.lon)时,图标可以更新它在地图上的位置。
我试着挖掘不同的对象,并在控制台和文档中读取它们的属性,我在这里搜索了Stackoverflow,但不幸的是没有运气。我是连接到iconFeature,还是必须用另一种方式来实现呢?也许是什么很简单的东西?任何帮助都是非常感谢的。
发布于 2015-08-11 14:30:15
如果要将图标移动到地图上,最好使用ol.Overlay
。您可以对每个更改使用marker.setPosition(coord)
。
工作的小提琴。单击“地图”更改标记的位置。
https://stackoverflow.com/questions/31942389
复制相似问题