如何使用css更改Open Layers默認縮放工具position？
[英]How to Change position of default zoom tool of Open Layers using css?
1 個解決方案
解決方案1
2 2022-03-30 02:01:35
要將縮放控件放在 map 的左上角，請設置：
.map .ol-zoom {
top: 10px;
left: auto;
right: 10px;
}
（正如@Mike 在他的評論中指出的那樣）
代碼片段：
var map = new ol.Map({ target: 'map', layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({ center: ol.proj.fromLonLat([37.41, 8.82]), zoom: 4 }) });
html, body { height: 100%; width: 100%; padding: 0px; margin: 0px; }.map { height: 100%; width: 100%; }.map.ol-zoom { top: 10px; left: auto; right: 10px; }
<:doctype html> <html lang="en"> <head> <meta charset="utf-8"> <link rel="stylesheet" href="https.//cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.14.1/css/ol:css" type="text/css"> <script src="https.//cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.14.1/build/ol.js"></script> <title>OpenLayers example</title> </head> <body> <div id="map" class="map"></div> </body> </html>
如何使用 Css 設置縮放默認值
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.