onload=”initMap()”的作用

Posted 算法与编程之美

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了onload=”initMap()”的作用相关的知识,希望对你有一定的参考价值。

1 问题

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

2 方法

我在学习散点图的制作发现每个案例里面都有<body οnlοad=”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 οnlοad="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 结语

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

实习编辑:李欣容

稿件来源:深度学习与文旅应用实验室(DLETA)

以上是关于onload=”initMap()”的作用的主要内容,如果未能解决你的问题,请参考以下文章

添加加载事件

Rails:为特定视图放置 onload 的位置

window.onload 和document ready的区别

第五章jQuery

加载完后执行

类型错误:window.initMap 不是函数