gpt4 book ai didi

javascript - 当我使用 javascript 加载图 block 时,openlayers map 中如何仅显示一个图 block

转载 作者:行者123 更新时间:2023-12-03 01:49:59 24 4
gpt4 key购买 nike

最近,我正在做一项有关将图 block 加载到 openlayers map 中的工作。但 map 上显示的瓷砖让我感到困惑。当我仅加载一个图 block 时, map 会显示无限数量的该图 block 。但结果与我不兼容。我该怎么做才能在 openlayers map 中只显示一个图 block ?我很高兴有任何要求。代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>tiles-test</title>
<link rel="stylesheet" href="ol.css" type="text/css">
<script src="https://openlayers.org/en/v4.6.5/build/ol.js"></script>
<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>

</head>
<body>
<div id="map" style="width: 100%"></div>
<script type="text/javascript">

var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM(),
}),
new ol.layer.Tile({
source: new ol.source.XYZ({
urls: ['../1.png', '../2.png'],
projection: 'EPSG:3857'

}),
}),
],
target: 'map',
controls: ol.control.defaults({
attributionOptions: ({
collapsible: false
})
}),
view: new ol.View({
center: ol.proj.transform(
[30, 30], 'EPSG:4326', 'EPSG:3857'),
zoom: 10
})

});
</script>
</body>
</html>

map 显示结果如下: enter image description here

最佳答案

XYZ 源是一个平铺源,不适用于单个图像。它使用url 模式来加载图 block 。

查看url/urls参数in the docs :

Must include {x}, {y} or {-y}, and {z} placeholders. A{?-?} template pattern, for example subdomain{a-f}.domain.com, may beused instead of defining each one separately in the urls option.

XYZ 的 TileGrid定义网格的外观。由于您没有指定它,因此它使用默认配置并将您定义的(静态)url 应用到每个 map 图 block 。

如果您只想在 map 上放置静态图像,请使用 ImageStatic( docsexample )

关于javascript - 当我使用 javascript 加载图 block 时,openlayers map 中如何仅显示一个图 block ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50458718/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com