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()函数是初始化函数，可以在里面写一些初始化变量的操作。
