我想在任何经度和纬度(位置)上添加一个简单的标记。我用谷歌搜索了很多,但没有从那里找到任何合理的答案或帮助。我尝试了一些代码,但它们对我来说效果不佳。我不擅长编程和阅读现有代码。
请到这里http://openlayers.org/en/latest/examples/icon.html,看看这是一个很好的例子并显示图标,但背后有图像而不是任何地图。我试图在那里显示任何地图并显示经度和纬度的标记,但它不能在我的结束。
我只想在任何特定位置显示带标记的简单地图。单击时,弹出窗口应打开,并应包含有关该位置的信息
E.g。这是一家xyz餐厅,xyz酒店,xyz寺庙等。
答案 0 :(得分:0)
如果您想在点击标记时在弹出窗口中显示自定义内容:
$(element).popover({
'placement': 'top',
'html': true,
'content': "this is a "+feature.get('type')+" in location : "+feature.getGeometry().getCoordinates().toString()
});
如果您分享的链接中的示例不适合您,您可以在控制台中显示它返回的错误
答案 1 :(得分:0)
您链接的示例中的背景地图设计为看起来像图像。使用以下代码将其拉入:
var rasterLayer = new ol.layer.Tile({
source: new ol.source.TileJSON({
url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.json',
crossOrigin: ''
})
});
如果您需要其他地图,可以使用OpenLayers中提供的任何来源或自定义来源替换切片图层来源。也许OpenStreetMap会是一个选择吗?只需使用以下代码替换上面的代码段:
var rasterLayer = new ol.layer.Tile({
source: new ol.source.OSM()
});
定位弹出窗口并在该示例中设置其内容的代码是
var coordinates = feature.getGeometry().getCoordinates();
popup.setPosition(coordinates);
$(element).popover({
'placement': 'top',
'html': true,
'content': feature.get('name')
});
要同时显示纬度和经度,请将该代码更改为
var coordinates = feature.getGeometry().getCoordinates();
popup.setPosition(coordinates);
$(element).popover({
'placement': 'top',
'html': true,
'content': feature.get('name') + ' ' + ol.coordinate.toStringHDMS(coordinates, 1)
});