Question

我希望在鼠标下方获取图块的图像网址。

使用最新版本v4.6.4

有什么想法吗？

谢谢

Answer 1

切片源类包含有关切片网格的所有信息：tileSource.getTileGrid() 您可以访问它loader function并将坐标，比率和投影传递给它。

＆＃13;

const source = new ol.source.OSM();
const layer = new ol.layer.Tile({ source });
const view = new ol.View({
  center: [2500000, 0], zoom: 5
});
const map = new ol.Map({
  layers: [ layer,
    new ol.layer.Tile({
      source: new ol.source.TileDebug({
        projection: 'EPSG:3857',
        tileGrid: source.getTileGrid()
      })
    })
  ],
  target: 'map',
  view 
});

const tileUrlFunction = source.getTileUrlFunction();
map.on('click', function(event) {
 const grid = source.getTileGrid();
 const tileCord = grid.getTileCoordForCoordAndZ(event.coordinate, view.getZoom());
 console.log('clicked ', event.coordinate[0], event.coordinate[1]);
 console.log('tile z,x,y is:', tileCord[0],tileCord[1], tileCord[2]);
 console.log(tileUrlFunction(tileCord, 1, ol.proj.get('EPSG:3857')));
});

＆＃13;

<link href="https://openlayers.org/en/v4.6.4/css/ol.css" rel="stylesheet"/>
<script src="https://openlayers.org/en/v4.6.4/build/ol-debug.js"></script>
<div id="map" class="map"></div>

＆＃13;

Openlayers在鼠标下获取图块的图像URL

1 个答案: