我在 Mapbox Studio 中使用图块集创建了一个自定义地图来创建分区统计图,然后导出该地图,以使用 Mapbox GL JS 扩展地图。
我已按照创建图例的教程进行操作,该教程在使用 Javascipt.j 时效果很好: https://www.mapbox.com/mapbox.js/example/v1.0.0/custom-legend/
我需要使用 Mapbox GL JS,因为我还使用自定义 CSS 创建了弹出窗口,效果非常好。
“map.legendControl.addLegend(document.getElementById('legend').innerHTML);” 导致地图不显示弹出窗口。
请有人提供帮助,让 Mapbox 中的自定义图例能够使用 Mapbox GL JS 工作,因为 Mapbox 网站上没有文档。
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>Show polygon information on click</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.2/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.2/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>
<style>
.legend label,
.legend span {
display:block;
float:left;
height:15px;
width:20%;
text-align:center;
font-size:9px;
color:#808080; …Run Code Online (Sandbox Code Playgroud)