0

我想理想地显示几个较长的（4096x20k）图像边缘到边缘，但之间的一些填充也不会受到伤害。. .

如果图像看起来像 []，则所需的输出将类似于：[][][][]，并且仍然可以适当地平铺。. .

我知道我可以做到这一点的一些 hackey 方法，但我理想地寻找的是类似的东西： L.tileLayer('blah{x}blah{y}blah{z}', {shiftTilesBy: [xOffset, yOffset] });

我什至无法真正弄清楚传单如何计算平铺图像的范围。它只是继续请求每个轴上的图块直到它达到 404 吗？我希望将图像保留在不同的层中，因为我经常更新其中的一个或多个，因此从缓存等的角度来看，将图像预先融合成一个大的确实没有吸引力。

如果这不作为插件或类似插件存在，我将编写并贡献它。那么，作为一个后续问题，我应该从哪里开始寻找源代码来创建它？

谢谢。

4

1 回答 1

2

Instead of having 4 separate maps, could you use one map and use an overlay to break the map into 4 tiles?

Here's the HTML:

<body>
  <div id="map"></div>
  <div id="overlay">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  </div>
</body>

And the CSS:

html {
    overflow:hidden;
}

html,
body,
#map,
#overlay {
    width:100%;
    height:100%;
    position:absolute;
}

#overlay {
    position:absolute;
    top:0;
    left:0;
    /* Requred if you want the map to respond to pointer events */
    pointer-events:none;
}

#overlay div {
    height:100%;
    border-right:15px solid #FFFFFF;
    width:23%;
    float:left;
}

And now the whole shebang, here is a jsFiddle.

And here's the result: Leaflet 4-column example

于 2013-03-03T22:57:36.447 回答