問題描述
我正在編寫一個涉及導(dǎo)航技術(shù)插圖(平移、縮放、單擊)的網(wǎng)絡(luò)應(yīng)用程序.我認(rèn)為 Cloudmade Leaflet 是一個很好的工具，只是因為 有人用它來制作 XKCD 1110 平移/縮放，我真的很喜歡它的結(jié)果.
顯然，我需要平鋪和縮放我的原始技術(shù)插圖，但假設(shè)這是我已經(jīng)解決的一個微不足道的問題.然而，查看 Leaflet API，看來我必須轉(zhuǎn)換我的技術(shù)插圖(.ai、.svg 和 .png 文件)轉(zhuǎn)換為 GeoJSON 等地理標(biāo)準(zhǔn).這似乎是一個尷尬的提議.
誰能推薦 Leaflet 或任何其他工具來導(dǎo)航非地圖圖像?
你可以用 Leaflet 做到這一點.(我自己就是這樣做的.)
您必須將像素大小轉(zhuǎn)換為 latlong(緯度/經(jīng)度).Leaflet 通過使用 Simple 坐標(biāo)參考系統(tǒng)"、map.project 和 map.unproject 為您提供了一種簡單的方法.p>
首先，像這樣構(gòu)建你的地圖:
var map = L.map('map', {最大縮放:20，最小縮放:20，crs:L.CRS.Simple}).setView([0, 0], 20);…然后設(shè)置地圖邊界(對于 1024x6145 的圖像):
var southWest = map.unproject([0, 6145], map.getMaxZoom());var northEast = map.unproject([1024, 0], map.getMaxZoom());map.setMaxBounds(new L.LatLngBounds(southWest, northEast));此處提供了有關(guān)拆分圖像的更多詳細(xì)信息，包括一個 Ruby gem，它也可能有用.
I am writing a web app that involves navigating technical illustrations (pan, zoom, click). I assume that Cloudmade Leaflet a good tool for this, only because someone used it to make XKCD 1110 pan/zoomable and I really like how it turned out.
Obviously, I would need to tile and scale my original technical illustration, but let's say that's a trivial problem that I have solved. Looking at the Leaflet API, however, it appears I would have to convert my tech illustrations (.ai, .svg, and .png files) to a geographical standard like GeoJSON. That seems like an awkward proposition.
Can anyone recommend Leaflet, or any other tool, for navigating non-map imagery?
You can do this with Leaflet. (I have done exactly this myself.)
You do have to convert your pixel sizes to latlong (latitude/longitude). Leaflet provides you an easy way to do that by using the Simple "Coordinate Reference System", map.project and map.unproject.
First, construct your map like this:
var map = L.map('map', {
maxZoom: 20,
minZoom: 20,
crs: L.CRS.Simple
}).setView([0, 0], 20);
…and then set the map bounds (for an image that is 1024x6145):
var southWest = map.unproject([0, 6145], map.getMaxZoom());
var northEast = map.unproject([1024, 0], map.getMaxZoom());
map.setMaxBounds(new L.LatLngBounds(southWest, northEast));
There's more details regarding splitting your images available here including a Ruby gem which might also be useful.
這篇關(guān)于Leaflet 是非地圖圖像的好工具嗎?的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網(wǎng)！