如何为非地理来源的传单制作平铺的图像金字塔

Question

假设我有一个非地理图像，而不是通常的地图。比方说，X射线，核磁共振扫描或显微镜图像，我想使用传单，这样我可以放大，放大，并在一些预定的点上放置一些标记。

我从非地理地图上读到了这个例子，但是这个例子演示了使用一个图像而不是平铺。我更喜欢瓷砖，因为我的形象会相当大。还有别的东西适合我上面描述的那个箱子吗？我正在调查格弦，但我还没有明确这是否适用于任何栅格文件，这仅适用于普通地图。

Answer 1

这里是我的经验，如何从PDF或高分辨率图像或非滑动地图等来源创建拖泥带水的地图。无论如何，我想写一篇文章，所以让这个答案成为一篇尚未写好的文章的草图。

举个例子，这是一个带有矢量图形的欧洲内河航道PDF地图，还有一个滑图。

基本上，最合理的方法是制作一套标准的瓷砖，然后让小册子展示。也就是说，为每个缩放级别生产尺寸为256x256的瓷砖。

你不想要巨大的图像作为层，因为这将是沉重的浏览器。您也不希望在浏览器中进行任何调整，这将导致质量低下。

幸运的是，使用ImageMagick创建tiles非常容易。我就是这样做的。

决定你想要多少缩放级别

首先，决定你想要多少缩放级别。这取决于地图，根据我的经验，你最多需要5-7缩放级别。让我们拿5个缩放级别为例。您生产的级别越多，您对硬件的要求就越高。下面的接近可能不适合超过7-8变焦级别.

呈现或调整源图像的大小

接下来，为每个缩放级别呈现或调整图像大小。必须生成具有以下维度之一的图像：

• 级别0上的256像素
• 级别1上的512像素
• 2级1024像素
• 级别3上的2048像素
• 级别4上的4096像素
• 诸若此类。

注意:这一步的结果是巨大的图像。5级约为10 MB，第6级约为20 MB，第7级约为40 MB。小心，尝试在“正常”工具中打开这些图像。

调整普通高分辨率图像的大小

如果您的源是高分辨率映像，只需将convert -resize与x*256*或*256*x一起使用即可。

convert images\source.jpg -resize   x256 images\0.jpg
convert images\source.jpg -resize   x512 images\1.jpg
convert images\source.jpg -resize  x1024 images\2.jpg
convert images\source.jpg -resize  x2048 images\3.jpg
convert images\source.jpg -resize  x4096 images\4.jpg
convert images\source.jpg -resize  x8192 images\5.jpg

如果你有几个不同变焦级别的缩放图像(我想这将是MRI扫描的情况)，选择最接近缩放的源图像。

处理已经平铺的图像

在某些情况下，源图像已经被切成块。这是典型的“旧”地图客户端，你想滑动。这是一个例子，瓷砖被称为vk-X-Y.jpg，并与一些重叠的切割。在这种情况下，首先必须裁剪图像：

magick data\vk-0-0.jpg  -crop 522x373+0x0 images\t-0-0.jpg
magick data\vk-1-0.jpg  -crop 522x373+0x0 images\t-1-0.jpg
magick data\vk-2-0.jpg  -crop 522x373+0x0 images\t-2-0.jpg
magick data\vk-3-0.jpg  -crop 522x373+0x0 images\t-3-0.jpg
magick data\vk-4-0.jpg  -crop 522x373+0x0 images\t-4-0.jpg
magick data\vk-5-0.jpg  -crop 650x373+0x0 images\t-5-0.jpg
...

若要计算将垂直和水平相邻瓷砖加载到图形编辑器中的裁剪参数，请尝试匹配它们并检查偏移坐标。

然后，在裁剪瓷砖时，将它们附加到一个大图像中：

magick images\t-0-0.jpg images\t-1-0.jpg images\t-2-0.jpg images\t-3-0.jpg images\t-4-0.jpg images\t-5-0.jpg +append images\t-0.jpg
...
magick images\t-0.jpg images\t-1.jpg images\t-2.jpg images\t-3.jpg images\t-4.jpg images\t-5.jpg images\t-6.jpg images\t-7.jpg images\t-8.jpg images\t-9.jpg images\t-10.jpg -append images\t.jpg

这个裁剪和附加操作的结果是一个大的高分辨率的地图图像.如上面所述，将其调整到每个级别。

调整PDF大小

在呈现PDF时，我更喜欢使用density进行调整大小。要计算每个缩放级别的密度(这是Windows命令，相应地修改Linux )：

identify -precision 16 -format "%%[fx:((256/max(w,h))*72)]\n%%[fx:((512/max(w,h))*72)]\n%%[fx:((1024/max(w,h))*72)]\n%%[fx:((2048/max(w,h))*72)]\n%%[fx:((4096/max(w,h))*72)]" source.pdf

这给了你这样的东西：

21.89073634204276
43.78147268408551
87.56294536817103
175.1258907363421
350.2517814726841

(4096/max(w,h))*72表达式的魔力很简单：(目标大小/源大小)*标准DPI。

有密度渲染图像：

convert -verbose -density 21.89073634204276 source.pdf        images\0.png
convert -verbose -density 43.78147268408551 source.pdf        images\1.png
convert -verbose -density 87.56294536817103 source.pdf        images\2.png
convert -verbose -density 175.1258907363421 source.pdf        images\3.png
convert -verbose -density 350.2517814726841 source.pdf        images\4.png

在更高的层次上，这可能需要很多时间。

在瓷砖中切割水平图像

此时，每个层应该有一个图像。现在我们可以把它们切成瓦片：

convert -verbose images\0.png -crop 256x256 +adjoin -background white -extent 256x256 -set filename:tile "%%[fx:floor(page.x/256)]_%%[fx:floor(page.y/256)]" +repage "tiles\0_%%[filename:tile].png"
convert -verbose images\1.png -crop 256x256 +adjoin -background white -extent 256x256 -set filename:tile "%%[fx:floor(page.x/256)]_%%[fx:floor(page.y/256)]" +repage "tiles\1_%%[filename:tile].png"
convert -verbose images\2.png -crop 256x256 +adjoin -background white -extent 256x256 -set filename:tile "%%[fx:floor(page.x/256)]_%%[fx:floor(page.y/256)]" +repage "tiles\2_%%[filename:tile].png"
convert -verbose images\3.png -crop 256x256 +adjoin -background white -extent 256x256 -set filename:tile "%%[fx:floor(page.x/256)]_%%[fx:floor(page.y/256)]" +repage "tiles\3_%%[filename:tile].png"
convert -verbose images\4.png -crop 256x256 +adjoin -background white -extent 256x256 -set filename:tile "%%[fx:floor(page.x/256)]_%%[fx:floor(page.y/256)]" +repage "tiles\4_%%[filename:tile].png"
convert -verbose images\5.png -crop 256x256 +adjoin -background white -extent 256x256 -set filename:tile "%%[fx:floor(page.x/256)]_%%[fx:floor(page.y/256)]" +repage "tiles\5_%%[filename:tile].png"

这样产生的文件如下：

• tiles/0_0_0.png
• tiles/1_0_0.png
• tiles/1_0_1.png
• tiles/1_1_0.png
• tiles/1_1_1.png
• 等。

这是您的静态预渲染集256x256大小的瓷砖。

配置传单

现在，您只需配置传单。假设平铺文件相对于HTML位于../tiles目录中，它只是：

L.tileLayer('../tiles/{z}_{x}_{y}.png', {
    maxZoom: 5,
    noWrap: true,                     
    attribution: 'Some Attribution'
}).addTo(map);

如果您想设置适当的初始视图，缩放/移动到您想要的位置，请在开发工具中打开JavaScript控制台，然后键入：

map.getCenter();
map.getZoom();

然后在初始化映射时使用打印的参数：

var map = L.map('map').setView([-26.3525, -65.0390], 3);

添加标记：

L.marker([-26.3525, -65.0390], {title: "Hi there!"}).addTo(map);

即使当你平移或缩放的时候，这个标记也会保持在相同的位置。

下面是其中一个项目：

• https://github.com/highsource/unece-maps

Answer 2

利维普斯有一个操作，它可以在一个命令中为传单制作一个拖泥带水的地图。

例如，使用这个欧洲内河航道PDF地图 (谢谢@lexicore!)你可以进入：

vips dzsave European_inland_waterways_-_2012.pdf[dpi=600] xxx --layout google

它将生成一个名为xxx的目录，其中包含所有的瓷砖，可以上传到服务器上。它大约需要15秒(至少在这台笔记本上)。

它速度快，几乎不需要记忆。细节随文件格式略有不同，但对于许多格式，它可以解码输入、构造所有金字塔层，以及编写输出块，所有这些都是并行的，而且不需要将整个输入图像加载到内存中。我经常在一台普通的笔记本电脑上渲染超过30万x 30万像素的金字塔。

它可以做一些有用的文件类型以及通常的tiff、PNG、JPG等，包括SVG、FITS、DICOM和OpenSlide等。它还能使金字塔进行深度放大和放大。

Windows主机的一个好特性是能够将tileset写入zip文件，而不是文件系统。Windows在文件创建方面相当缓慢--使用一个大金字塔和小块，您可以在文件创建中花费几乎75%的CPU时间。将其写入zip文件，您可能会看到3倍的加速：

vips dzsave huge.tif xxx.zip --layout google

当然，将zip上传到服务器也更简单。

这里有一个libvips手册中介绍dzsave的一章并显示了所有选项。