<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

        <title>My first map</title>

 

        <style type="text/css">

            <!-- #map
{

                width:
100%;

                height:
500px;

                border:
1px
solid
#000;

            }

            -->

        </style>

 

        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

        <script>

            window.onload = function() {

                // Creating a reference to the mapDiv

                var mapDiv = document.getElementById('map');

                // Creating a latLng for the center of the map

                var latlng = new google.maps.LatLng(39.92, 116.46);

                // Creating an object literal containing the properties

                // we want to pass to the map

                var options = {

                    center: latlng,

                    zoom: 10,

                    mapTypeId: google.maps.MapTypeId.ROADMAP

                };

                // Creating the map

                var map = new google.maps.Map(mapDiv, options);

            }

        </script>

    </head>

 

    <body>

        <h1>My first map</h1>

        <div id="map"></div>

    </body>

 

</html>

 

Google Maps API3 之 Hello World的更多相关文章

  1. 检索Google Maps地图位置（小训练）

    名称:检索地图位置 内容:地图初期显示和检索显示 功能:根据条件检索地图的经度与纬度 1.在这之前我们需要创建一个表(Accoun__c),添加一个重要的字段地理位置情報,它会默认的给你两个字段经度和 ...

  2. Google Maps API V3 之绘图库 信息窗口

    Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...

  3. Google Maps API V3 之 图层

    Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...

  4. Google Maps API V3 之 路线服务

    Google官方教程: Google 地图 API V3 使用入门 Google 地图 API V3 针对移动设备进行开发 Google 地图 API V3 之事件 Google 地图 API V3 ...

  5. Google Maps地图投影全解析(3)：WKT形式表示

    update20090601:EPSG对该投影的编号设定为EPSG:3857,对应的WKT也发生了变化,下文不再修改,相对来说格式都是那样,可以到http://www.epsg-registry.or ...

  6. google maps js v3 api教程(3) -- 创建infowindow

    原文地址 前面我们学习了地图和标记的创建.那么今天我们来学习怎样在地图上显示一个窗口(infowindow) infowindow构造函数为:InfoWindow(opts?:InfoWindowOp ...

  7. google maps js v3 api教程(2) -- 在地图上添加标记

    原文链接 google maps javascript官方文档:https://developers.google.com/maps/documentation/javascript/ 我们在创建地图 ...

  8. google maps js v3 api教程(1) -- 创建一个地图

    原文地址 google maps javascript官方文档:https://developers.google.com/maps/documentation/javascript/ 在创建地图之前 ...

  9. Google Maps投影在ArcGIS中的设置

    Google Maps采用的地图投影为Web Mercator,其优点为不同维度其形状保持不变,当然面积要发生变化. ArcGIS9.3中可以直接设置为WGS 1984 Web Mercator,操作 ...

随机推荐

  1. Linux上面mount 域控的目录 超时 然后提示 error的解决办法

    mount error(112): Host is down 故障解决 https://blog.csdn.net/lepton126/article/details/89447713 之前查到过 这 ...

  2. Thinking In Java 4th Chap5 初始化和清理

    类的构造器名必须与类名一致,且无返回类型,通过参数类型的不同(即使顺序不同也行)可以重载构造器,也可以以此技巧重载方法 this关键字:表示对“调用方法的那个对象的引用”,也可将当前对象传递给其他方法 ...

  3. LeetCode 2——两数相加（JAVA）

    给出两个 非空 的链表用来表示两个非负的整数.其中,它们各自的位数是按照 逆序 的方式存储的,并且它们的每个节点只能存储 一位 数字. 如果,我们将这两个数相加起来,则会返回一个新的链表来表示它们的和 ...

  4. 测试工作小工具~总结&下载连接

    1.Gif录制小工具(动图提单 ≖ᴗ≖) 地址:https://licecap.en.softonic.com/download

  5. Spring Boot（一） 初步理解Spring Boot

    一.Spring Boot所解决的问题 Java开发十分笨重:繁多的配置.低下的开发效率.复杂的部署流程以头疼的第三方技术集成. Spring Boot的理念:习惯优于配置——项目中存在大量的配置,此 ...

  6. Iedis - Redis 在IDEA中的可视化工具破解

    2.如何破解 // 如果你没有改动IDEA的话,IDEA的插件库在这个目录下C:\Users\Administrator\.IntelliJIdea2017.3\config\plugins\Iedi ...

  7. vue-Elementui引入

    安装命令 npm install --save element-ui 可以直接复制官网的引用,复制到main.js里面:就可以忽略下面所有步骤 import Vue from 'vue'; impor ...

  8. django 中自定义方法simple_tag

    simple_tag定义以及使用 模板中自定义方法 1. 在app下创建一个名为templatetags的python包 2. 在python中创建python文件 my_tag.py 3. 在pyt ...

  9. 高性能Java科学与技术运算库Colt

    在学习<Machine Learning in Action>和<NLTK Natural Language Processing with Python>的过程中,我真切地感 ...

  10. 聚类算法之MeanShift

    机器学习的研究方向主要分为三大类:聚类,分类与回归. MeanShift作为聚类方法之一,在视觉领域有着广泛的应用,尤其是作为深度学习回归后的后处理模块而存在着. 接下来,我们先介绍下基本功能流程,然 ...