我正在尝试更改传单中缩放按钮上的CSS,但无法向这些按钮添加类或ID或其他内容。我什至如何访问它们?
有什么主意吗?
谢谢!
在这里我声明地图:
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
maxZoom: 18,
id: 'mapbox.streets',
accessToken: 'pk.eyJ1IjoicHcxN2wwMDgiLCJhIjoiY2pua2c2OWxuMGVkOTNxbWh5MWNqajEwdyJ9.X_SuGwNGs12TwCsrsUvBxw'
}).addTo(map);
在这里我包括缩放:
L.control.zoom({
position: 'topright',
}).addTo(map);
页面加载后,我看到它变成了一个包含许多传单类的按钮,但是我如何对它们进行更改?
答案 0 :(得分:0)
我想还有其他方法,但是要更改缩放按钮的样式,您可以按如下方式访问内置的CSS选择器:
fileList = os.listdir(path)
orgName = fileList[0].split(' (')[0]
if not orgName.endswith('.csv'):
orgName += '.csv'
for i in range(1, 8):
newName = orgName.replace('.csv', ' {%s}.csv'%i)
if CheckFilaName(newName): # check if exist and replace
break
.leaflet-touch .leaflet-bar a {
width: 50px;
background-color: red;
}
var map = L.map('mapid').setView([51.505, -0.09], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
L.marker([51.5, -0.09]).addTo(map)
.bindPopup('A pretty CSS3 popup.<br> Easily customizable.')
.openPopup();
#mapid {
height: 180px;
}
.leaflet-touch .leaflet-bar a {
width: 50px;
background-color: red;
}
body {
margin: 0px;
}
或使用js:
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin="" />
<script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" integrity="sha512-QVftwZFqvtRNi0ZyCtsznlKSWOStnDORoefr1enyq5mVL4tmKB3S/EnC3rRJcxCPavG10IcrVGSmPh6Qw5lwrg==" crossorigin=""></script>
<div id="mapid"></div>