我想在地图上显示“交通信息表单”地图框。以下是代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="Content/leaflet.css" />
</head>
<body>
<script src="Scripts/leaflet.js"></script>
<script src="Scripts/leaflet-providers.js"></script>
<h1>Traffic</h1>
<div id="mapidTraffic" style="height:512px;width:512px">
</div>
<script type="text/javascript">
var streetLayer = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=<redacted>', {
maxZoom: 18,
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>',
id: 'mapbox/streets-v11',
tileSize: 512,
zoomOffset: -1
});
var trafficLayer = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=<redacted>', {
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>',
id: 'mapbox.mapbox-traffic-v1',
});
var mymapTraffic = L.map('mapidTraffic', { layers: [streetLayer] });
var baseMaps = {
"Streets": streetLayer
};
var overlayMaps = {
"Traffic": trafficLayer
};
L.control.layers(baseMaps, overlayMaps).addTo(mymapTraffic);
mymapTraffic.setView([49.4513412, 11.1306931], 13);
</script>
</body>
</html>
当我在控件中单击“交通”时，只有黑色背景和一些街道线。我也想看看街道地图。
我该怎么办？
致以问候
Volkhard
使用Leaflet，您正在彼此叠加加载完整的地图图块。因此，由于Mapbox Traffic data仅由路况数据组成，因此当添加路况图层时，您会看到街道线（路况数据）和黑色背景，因为其中没有包含基本街道地图。