好的,我已经找到了一个完全符合我的要求的示例。我不知道如何为我的形象设置它,我不确定这是否是实现我目标的最佳方法。
预期结果:
http://maps.mixedbredie.net/leaflet/image.html
示例代码:
var map = L.map('map', {maxZoom: 17}).setView([51.495, -0.075], 14);
/* Instead of a tile layer, use a bitmap image */
var imageUrl = 'data/TM_pano.jpg';
var imageBounds = [[51.490, -0.122], [51.510, -0.028]];
L.imageOverlay(imageUrl, imageBounds).addTo(map);
L.marker([51.495, -0.075]).addTo(map)
.bindPopup("This is Table Mountain.");
var popup = L.popup();
function onMapClick(e) {
popup
.setLatLng(e.latlng)
.setContent("You clicked the map at " + e.latlng.toString())
.openOn(map);
}
map.on('click', onMapClick);
map.setMaxBounds(imageBounds);
问题:
1.) 如何选择经纬度、图像边界?
- 即.setView([51.495, -0.075], 14)
- var imageBounds = [[51.490, -0.122], [51.510, -0.028]];
2.) zoom 0 应该显示我的整个图像吗?什么是合理的限制?
3.) 这种方法可以使用真实坐标吗?即绘制地下水管但使用该管道示意图的自定义 .jpg?然后我可以在管道上标记某些长度/纬度。
最佳答案
参见 http://omarriott.com/aux/leaflet-js-non-geographical-imagery/对于问题 1 和 2 对于第三个,您可以对图像进行地理配准(或变形),然后将其显示在 map 上,例如设置透明度。 地理配准可以使用 Qgis 或像 Mapwarper 这样的工具来完成 https://github.com/timwaters/mapwarper
(老问题,但我认为答案可能有用)
关于javascript - 如何使用 Leaflet 从图像创建 map ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19017585/