最近,我正在做有关将图块加载到openlayers地图中的工作。但是地图上显示的瓷砖使我感到困惑。当我仅加载一个图块时,地图会显示该图块的数量不限。但是结果与我不兼容。我要怎么做才能在openlayers地图中只显示一个图块?我很高兴有任何要求。
代码如下所示:
<!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>
图中显示的结果如下:
enter image description here
最佳答案
XYZ源是一个图块源,并非用于单个图像。它使用url模式加载图块。
查看url / urls参数in the docs:
必须包含{x},{y}或{-y}和{z}占位符。一个
{?-?}模板模式,例如subdomain {a-f} .domain.com,可能是
而不是在urls选项中分别定义每一个。
XYZ的TileGrid定义网格的外观。由于未指定,因此它使用默认配置并将定义的(静态)URL应用于每个地图图块。
如果只想在地图上放置静态图像,请使用ImageStatic(docs,example)
关于javascript - 当我使用javascript加载图块时,openlayers map 中仅显示一个图块,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/50458718/