Leaflet 带有自定义地图(CRS)的传单-如何将JPG转换为TileLayer瓷砖

Leaflet 带有自定义地图(CRS)的传单-如何将JPG转换为TileLayer瓷砖,leaflet,Leaflet,我有一个JPG文件,其中的地图不是真实的比例,也不能用真实的地理纬度和经度来表示,所以我使用了传单CRS解决方案,这似乎是一条可行的道路 问题是映射文件(JPG)大小约为30MB,无法在单个请求中加载,因此我阅读了更多内容,找到了TileLayer解决方案。 我甚至发现了一个(下面也提供了代码):) 现在,我唯一的问题是如何获取JPG文件并将其转换为图层?有在线/离线工具吗? 据我所知,我所需要的只是将大图像分割成256px 256px的平铺,将其放在我服务器的目录中,剩下的工作由TileLay

我有一个JPG文件,其中的地图不是真实的比例,也不能用真实的地理纬度和经度来表示,所以我使用了传单CRS解决方案,这似乎是一条可行的道路

问题是映射文件(JPG)大小约为30MB,无法在单个请求中加载,因此我阅读了更多内容,找到了TileLayer解决方案。
我甚至发现了一个(下面也提供了代码):)

现在,我唯一的问题是如何获取JPG文件并将其转换为图层?有在线/离线工具吗? 据我所知,我所需要的只是将大图像分割成256px 256px的平铺,将其放在我服务器的目录中,剩下的工作由TileLayer来完成

var w=14000;
var h=10000;
var-mapMinZoom=2;
var mapMaxZoom=5;
var\u map=L.map('map'{
maxZoom:mapMaxZoom,
minZoom:mapMinZoom,
crs:L.crs.Simple,
动物控制:错误,
属性控制:false,
特雷蒂娜:是的
});
var_mapBounds=新的L.LatLngBounds(
_取消映射([0,h],mapMaxZoom),
_取消投影([w,0],mapMaxZoom));
_setMaxBounds(_mapbunds);
var\u mapCenter=\u map.unproject([w/2,h/2],mapMaxZoom);
_地图.setView(_地图中心,3);
var_tileLayer=L.tileLayer(
'http://d3uxxcqax6u8f1.cloudfront.net/assets/img/map/{z} /map{x}{y}.png'{
minZoom:mapMinZoom,maxZoom:mapMaxZoom,
边界:_mapBounds,
连续世界:真的,
诺拉普:没错,
瓷砖尺寸:250,
crs:L.crs.Simple,
特雷蒂娜:错
}).addTo(_map)
html,body,#map{宽度:100%;高度:100%;边距:0;填充:0;}

参见例如和


一旦你有了磁贴,是的,只要把它们放在你的文件旁边就可以了。

我找到了这个创建本地存储磁贴的程序:

命令:

vips.exe dzsave input.jpg tiles_folder --layout google --background 0 --centre --suffix .jpg[Q=100] 
其中
input.jpg-你的大形象
tiles\u文件夹-输出文件夹
--谷歌布局-这对传单很重要
--背景0-黑色背景
--后缀.jpg[Q=100]-瓷砖质量(100%)

然后在传单中:

L.tileLayer('tiles_folder/{z}/{y}/{x}.jpg', {  
tileSize: 256 // or 512  
crs: L.CRS.Simple // this is important for nongeo maps
}).addTo(map);