百度地图案例+异步加载★★★★★
在对性能敏感的场景下，我们可以选择异步加载百度地图，从而加快首屏的渲染速度
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#map {
width: 1200px;
height: 800px;
border: 1px solid #ccc;
margin: 20px auto;
}
.anchorBL {
display: none;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
<!-- <script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=beRaxcBBOVvG8pfZMgaWSmdKSgr44jsh"></script> -->
<script>
function init() {
let myMap = new BMapGL.Map("map");
let point = new BMapGL.Point(121.66805, 31.14794);
myMap.centerAndZoom(point, 20);
myMap.enableScrollWheelZoom();
myMap.setTilt(60);
myMap.setHeading(30);
}
function loadScript() {
let script = document.createElement("script");
script.src = "https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=beRaxcBBOVvG8pfZMgaWSmdKSgr44jsh&callback=init";
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
</html>
本文含有隐藏内容，请 开通VIP 后查看