onload=”initMap()”的作用

1 问题

当我们学习散点图的制作时，会发现案例代码中都用到了onload=initMap()，那么它们在这里的作用是什么呢？

2 方法

我在学习散点图的制作发现每个案例里面都有<body onload=”initMap()”>这行代码，这行代码还不能轻易删除，所以它是必须存在的。代码的作用是指打开页面的同时调用INIT()函数，INIT()函数是初始化函数，我们可以在里面写一些初始化变量的操作，变量操作我们写在function initMap(){}里面，function initMap(){}这里面我们写的都是js的代码，而上面写在body标签里面的是HTML的代码。所以当我们body标签里面写了init函数时，那么我们在后面也要写上js的代码，它就可以在打开页面的同时调用init函数，实现函数里面的变量操作。

3 实验结果与讨论

通过实验、实践等证明提出的方法是有效的，是能够解决开头提出的问题。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>单色散点图</title>
</head>
<script
charset="utf-8"
src="https://map.qq.com/api/gljs?v=1.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77&libraries=visualization"
></script>
<style type="text/css">
html,
body {
height: 100%;
margin: 0px;
padding: 0px;
}
#container {
width: 100%;
height: 100%;
}
</style>
<body onload="initMap()">
<div id="container"></div>
<script src="https://mapapi.qq.com/web/lbs/visualizationApi/demo/data/users_tencent.js"></script>
<script>
function initMap() {
//初始化地图
var map = new TMap.Map("container", {
zoom: 3, //设置地图缩放级别
center: new TMap.LatLng(40.11856816068578, 65.01399123678493), //设置地图中心点坐标
mapStyleId: "style4", //个性化样式
renderOptions: {
enableBloom: true, // 泛光
},
});
//初始化散点图并添加至map图层
var dot = new TMap.visualization.Dot({
styles: {
default: {
fillColor: "#1DFAF2", //圆形填充颜色
radius: 1, //圆形半径
},
},
}
.addTo(map)
dot.setData(dotData); //设置数据
}
</script>
</body>
</html>

4 结语

onload=”initMap()”代码的作用是指打开页面的同时调用INIT()函数，INIT()函数是初始化函数，可以在里面写一些初始化变量的操作。

实习编辑：李欣容

稿件来源：深度学习与文旅应用实验室（DLETA）

本站仅提供存储服务，所有内容均由用户发布，如发现有害或侵权内容，请点击举报。