在 LeafletJS 中使用自定义地图图像图块? [英] Using custom map image tiles in LeafletJS?
问题描述
我的瓷砖是否需要遵守任何特定规格?
Do my tiles need to adhere to any particular specs?
我有一个大的图像文件，我想用 LeafletJS 将它变成一个地图.我将使用 Python Imaging Library 将其切割成我需要的所有各种图块.
I have a large image file which I'd like to turn into a map with LeafletJS. I am going to be using the Python Imaging Library to cut it up into all the various tiles I need.
但是，我找不到任何有关在 Leaflet 中使用自定义地图的信息.我是否以某种方式向 Leaflet 提供 X、Y、Z 信息的范围?我是否给它每个图块的像素大小?它会自己解决这个问题吗?
However, I can't find any information about using custom maps in Leaflet. Do I provide Leaflet with the range of X,Y,Z info somehow? Do I give it the pixel size of each tile? Does it figure this out on its own?
将我的问题归结为一个简洁的问题:我需要做什么才能使用 LeafletJS 获得可以兼作地图图块的图像文件，以及我需要在前端脚本中做什么(如果有的话)?(除了我的自定义 URL 的明显指定之外)
To put my question into one concise question: What do I need to do in order to have image files that can double as map tiles with LeafletJS, and what, if anything, do I need to do in my front-end script? (beyond the obvious specifying of my custom URL)
推荐答案
你正在寻找一个 TileLayer.在这个 TileLayer 中，您将要获取的图像的 URL 提供给带有如下模板的传单:
You are looking for a TileLayer. In this TileLayer, you give the URL for the to-be-fetched images to leaflet with a template like this:
http://{s}.somedomain.com/blabla/{z}/{x}/{y}.png
当您处于指定的缩放、x 和 y 级别时，Leaflet 将自动获取您提供的 URL 上的图块.
When you are at the specified zoom, x and y level, Leaflet will automatically fetch the tiles on the URL you gave.
根据您要显示的图像，大部分工作将在图块生成中进行.默认情况下，瓷砖的大小为 256x256px(可以在 TileLayer 选项中更改)，如果您使用地理数据，则使用的投影是墨卡托投影.获得正确的磁贴 ID 可能需要一些时间.这里是一个示例，了解 tile id 的工作原理.
Depending on the image you want to show, the bigger part of the work will however be in the tile generation. Tiles by default have a 256x256px size (can be changed in the TileLayer options), and if you are using geodata the used projection is Mercator projection. It may take some time to get the tile ids right. Here is an example on how the tile ids work.
这篇关于在 LeafletJS 中使用自定义地图图像图块?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
