Google Maps基础及实例解析

网友投稿 261 2023-07-09


Google Maps基础及实例解析

Google Maps 基础

创建一个简单的 Google 地图

现在让我们创建一个简单的 Google 地图。

以下是显示了英国伦敦的 Google 地图:

实例

实例效果图(可以拷贝直接运行,当然你要能够访问Google)

实例解析

我们以以上实例来解析 Google 地图的创建过程。

应用为什么要声明 HTML5?

大多数浏览器使用 "标准模式" 的 HTML5 文档渲染页面,这就意味着你的应用是兼容各大浏览器的。

另外,如果没有DOCTYPE标签,浏览器则使用混杂模式 (quirks mode)进行渲染页面内容。

提示: 应该注意的是一些"混杂模式 "中的css并不能使用与标准模式中。在具体的应用中,所有基于百分比的大小都必须从父块元素继承 。如果在父模块中没有指定大小,默认值为 0 x 0 像素。如果你想使用百分比,可以在

这个样式声明表明地图模块的(GoogleMap)应 HTML高度为100%。

添加 Google 地图 API Key

在以下实例中第一个

将google生成的 API key 放置于 key 参数中(key=YOUR_API_KEY)。

The sensor 参数是必须的,该参数用于指明应用程序是否使用一个传感器 (类似 GPS 导航) 来定位用户的位置。参数值可以设置为 true 或者 false。

HTTPS

如果你的应用是安全的HTTP(HTTPS:HTTP Secure)应用,你可以使用 HTTPS 来加载 Google 地图 API:

异步加载

同样我们也可以在页面完全载入后再加载 Google 地图 API。

以下实例使用了 window.onload 来实现页面完全载入后加载 Google 地图 。 loadScript() 函数创建了加载 Google 地图 API


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:封装的dialog插件 基于bootstrap模态对话框的简单扩展
下一篇:关于java中Map的九大问题分析
相关文章

 发表评论

暂时没有评论,来抢沙发吧~