代码如下：

<!DOCTYPE html>

<html>

  <head>

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

    <style type="text/css">

      html { height: % }

      body { height: %; margin: ; padding:  }

      #map_canvas { height: % }

    </style>

    <script type="text/javascript"

      src="http://maps.googleapis.com/maps/api/js?key=your-api-key&sensor=true">

    </script>

    <script type="text/javascript">

      function initialize() {

        var mapOptions = {

          center: new google.maps.LatLng(-34.397, 150.644),

          zoom: ,

          mapTypeId: google.maps.MapTypeId.ROADMAP

        };

        var map = new google.maps.Map(document.getElementById("map_canvas"),

            mapOptions);

      }

    </script>

  </head>

  <body onload="initialize()">

    <div id="map_canvas" style="width:100%; height:100%">    </div>

  </body>

</html>

zoom设置得越小~则地图显示范围越大~

new google.maps.LatLng(X,Y)输入经纬度。

获取api-key:
https://developers.google.com/maps/documentation/javascript/tutorial?hl=zh-cn#api_key

https://code.google.com/apis/console/b/0/?noredirect#project:547251066599:access

简易google地图api调用的更多相关文章

  1. Google 地图 API V3 之事件

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

  2. Google 地图 API V3 之控件

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

  3. Google 地图 API V3 之 叠加层

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

  4. Google 地图 API for Android

    原文:Introduction to Google Maps API for Android 作者:Eunice Obugyei 译者:kmyhy 从健康类 app Runkeeper 到游戏 app ...

  5. Android Google 地图 API for Android

    从健康类 app Runkeeper 到游戏 app 精灵宝可梦,位置服务对现代 app 来说越来越重要. 在本文中,我们将创建一个 app,名字就叫做 City Guide.这个 app 允许用户搜 ...

  6. Google 地图 API V3 使用入门

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

  7. Google 地图 API V3 针对移动设备进行开发

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

  8. Google地图接口API之Google地图 API 参考手册(七)

    Google 地图API 参考手册 地图 构造函数/对象 描述 Map() 在指定的 HTML 容器中创建新的地图,该容器通常是一个DIV元素. 叠加层 构造函数/对象 描述 Marker 创建一个标 ...

  9. 腾讯地图 API 调用入门

    本文仅为腾讯地图 API 调用入门,如需进阶学习,请在腾讯位置服务网站上进行学习. 登陆网址 https://lbs.qq.com/ 点击右上角的登陆按钮,需要进行注册按照流程进行就好. 完成之后,选 ...

随机推荐

  1. Reducing the Dimensionality of data with neural networks / A fast learing algorithm for deep belief net

    Deeplearning原文作者Hinton代码注解 Matlab示例代码为两部分,分别对应不同的论文: . Reducing the Dimensionality of data with neur ...

  2. javascript widget ui mvc

    MVC只是javascript的一个UI模式 JavaScript UI----UI, Template, MVC(View)----Backbone, Angular RequireJS------ ...

  3. Hibernate如何一个类映射两个表

    一个User类有username,password属性,还有 otherInformation等其他属性,username和password映射到一个表,otherInformation等其他属性映射 ...

  4. 【Linux】鸟哥的Linux私房菜基础学习篇整理（八）

    1. useradd [-u UID] [-g 初始用户组] [-G 次要用户组] [-mM]\   [-c 说明栏] [-d 主文件夹绝对路径] [-r] [-s shell] 用户账号名:新增用户 ...

  5. 【转】java 容器类使用 Collection，Map，HashMap，hashTable，TreeMap，List，Vector，ArrayList的区别

    原文网址:http://www.360doc.com/content/15/0427/22/1709014_466468021.shtml java 容器类使用 Collection,Map,Hash ...

  6. Count Complete Tree Nodes ——LeetCode

    Given a complete binary tree, count the number of nodes. Definition of a complete binary tree from W ...

  7. JavaScript 函数绑定 Function.prototype.bind

    ECMAScript Edition5 IE9+支持原生,作用为将一个对象的方法绑定到另一个对象上执行. Function.prototype.bind = Function.prototype.bi ...

  8. Apache multiple domains setup

    Running several name-based web sites on a single IP address. Your server has a single IP address, an ...

  9. wordpress 404 error on all pages!

    You have to enable mod_rewrite in apache itself or you won't be able to have permalinks the way you ...

  10. jQuery整体架构源码解析

    最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,让你感叹代码之美. 其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐 ...