<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. vue2.0 + npm + webpack 开发===环境配置

     cnpm安装:npm install -g cnpm --registry=http://registry.npm.taobao.org 1.安装vue-cli脚手架构建工具cnpm install ...

  2. 小菜鸟之oracle

    oracle 存储过程 函数 创建 删除 参数 传递 函数 查看 包 系统包 分类: Oracle 2011-10-27 17:31 264人阅读 评论(0) 收藏 举报   认识存储过程和函数 存储 ...

  3. Mac安装postgresql和卸载PostgreSQL

    1.homebrew安装 brew install postgresql 2.初始化 initdb /usr/local/var/postgres 3.创建数据库及查看数据库 (1)先创建db. cr ...

  4. RMI(远程方法调用)

    Remote Method Invocation  跨虚拟机间调用 使用 RMI 技术可轻松将 服务提供者(Service Provider)与 服务消费者(Service Consumer)进行分离 ...

  5. 聊聊BIO、NIO与AIO的区别

    题目:说一下BIO/AIO/NIO 有什么区别?及异步模式的用途和意义? 1F 说一说I/O首先来说一下什么是I/O? 在计算机系统中I/O就是输入(Input)和输出(Output)的意思,针对不同 ...

  6. [Lua]LuaAPI整理

    ref :https://blog.csdn.net/ouyangshima/article/details/43339571   LUA和C/C++的沟通桥梁——栈 Lua生来就是为了和C交互的,因 ...

  7. CentOS7安装配置redis5集群

    一.服务器准备 本文准备了3台服务器 , 分别是 172.18.0.231 172.18.0.232 172.18.0.233 每台运行2个redis实例, 端口分别为7000 7001 ,即总共6个 ...

  8. HTTP协议探究（三）：HTTPS

    一 复习与目标 1 复习 代理:转发通信数据(一般协议不变,作为中间人,可对报文进行过滤修改) 网关:转发通信数据(协议改变,作为资源拥有者) 隧道:转发通信数据(协议不变,作为管道,不对报文进行过滤 ...

  9. codeblocks 使用汇总

    codeblocks 使用汇总 http://www.cnblogs.com/-clq/archive/2012/01/31/2333247.html

  10. SpEL表达式总结

    前言SpEL(Spring Expression Language),即Spring表达式语言,是比JSP的EL更强大的一种表达式语言.为什么要总结SpEL,因为它可以在运行时查询和操作数据,尤其是数 ...