使用高德地图js api 制作网页上的地图应用。

1.先申请一个 开发者用的 key 。

2. 在页面中引入高德提供的地图js  <script src="http://webapi.amap.com/maps?v=1.3&key=您申请的key"></script>

完成以上两步就可以在页面中加载 高德地图了。

注意设置 地图容器的 大小:

  

 <!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width"> <script src="http://webapi.amap.com/maps?v=1.3&key=efda1426d63ee7f7582d11fd6376cfed"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<script type ="text/javascript" src ="jquery.js"></script>
<style type="text/css">
#container{
height: 800px;
width: 700px
}
</style>
</head>
<body>
<div id="container">
</div>
<script>
var map = new AMap.Map('container',{zoom:10,resizeEnable:true,center:[116.39757156,39.90973623]});
var marker = new AMap.Marker({
position:[121.62689209,38.91240739],
map:map
});
</script>
</body>
</html>

高德地图 js api 使用的更多相关文章

  1. 高德地图 JS API - 根据地名实现标记定位

    德地图 JS API 使用前的准备工作请参考官方网站说明: https://lbs.amap.com/api/javascript-api/guide/abc/prepare 根据地名实现地图标记定位 ...

  2. 高德地图JS API 开发小结

    项目中有一块功能要用到高德地图,所以,想把编码小结一下. 首先是地图的初始化 var map = new AMap.Map("mapDiv", {                  ...

  3. 高德地图 JS API - 根据经纬度获取周边建筑地标

    像我们经常用的微信或微博,发表动态时都有选择位置的功能,根据当前的定位获取附近的地标.利用高德地图我们就可以实现这样的功能. 1. 具体代码: // 高德地图查询周边 function aMapSea ...

  4. 高德地图JS API获取经纬度,根据经纬度获取城市

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  5. 高德地图 JS API (jsp + miniui(子页面数据返回父页面并设值) + 单个点标记 + 点标记经纬度 + 回显 + 限制地图显示范围+搜索)

    -*-  父页面js function mapFocus(){ //console.log("-*-"); var longitude = mini.get("jd&qu ...

  6. 高德地图JavaScript API开发研究

    高德地图JavaScript API是一套用JavaScript 语言编写的应用程序接口,可以通过各种API接口向地图添加内容,创建功能丰富.交互性强的地图应用.高德地图JavaScript API ...

  7. 在谷歌地图上绘制行政区域轮廓【结合高德地图的API】

    实现思路: 1.利用高德地图行政区域API获得坐标列表 2.将坐标列表绘制在谷歌地图上[因为高德地图和国内的谷歌地图都是采用GCJ02坐标系,所有误差很小,可以不进行坐标误差转换] 注意点: 1.用百 ...

  8. 高德地图 JavaScript API 开发系列教程(二)

    上节简单介绍高德地图JavaScript API及网页中基本地图展示.有了地图后我们可以用来做什么?有人说离我最近的超市在哪里,我怎么去?别急,这些功能我们后面都会慢慢实现.今天为大家详细讲解如何在地 ...

  9. 高德地图 JavaScript API 开发系列教程(一)

    高德地图 API 提供包括 Web API 即 JavaScript API,Android API,定位API,IOS API,WP API,Win8 API等,本系列教程主要针对高德 JavaSc ...

随机推荐

  1. atitit.userService 用户系统设计 v5 q330

    atitit.userService 用户系统设计 v5 q330 1. 新特性1 2. Admin  login1 3. 用户注册登录2 3.1. <!-- 会员注册使用 -->  商家 ...

  2. [svc]linux文件特殊权限

    这是老以前写的文章, 断断续续的可见那时候的心态还是不稳的. 生产使用: g1,g2组2个组的员工,  g2组要访问g1组/home下的文件,rx权限.  这个setfacl就有用. 方法1: 修改普 ...

  3. 【项目总结】:怎样做一个牛逼的Team leader?

    随着ITOO高校云平台3.1项目的结束,我们各种各样的总结也被提上了日程. Java版本号的全部开发者和Donet版本号的全部开发者坐在一起进行了关于项目开发管理的头脑风暴,尽管我仅仅是Donet开发 ...

  4. numpy.ravel()/numpy.flatten()/numpy.squeeze()

    numpy.ravel(a, order='C') Return a flattened array numpy.chararray.flatten(order='C') Return a copy ...

  5. JS高程3:表单脚本

    HTML和CSS对表单的操作还是比较乏力的,在表单操作中,JS势必会使用到. 基础知识 文本框 选择框 序列化 富文本编辑器 基础知识 HTMLFormElement接口可以创建或者修改<for ...

  6. poj 1806 Frequent values(RMQ 统计次数) 详细讲解

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1806 题目大意:给你一个非降序排列的整数数组,你的任务是对于一系列的询问,(i,j),回答序列中出现次 ...

  7. pow函数

    pow函数如果直接强制类型转换成int,会导致精度的损失.如果是int的幂计算,建议重写函数.或者用double型进行计算.

  8. linux2.4中netfilter_nat_alg机制分析--以FTP流程为例,分析NAT和ALG

    以FTP流程为例,分析NAT和ALG 网络环境: ×5+6=1286) 创建×5+6=1286),更新skb的应用层信息(这里应用层信息还是×5+6=1286) 创建×5+6=1286) 创建×5+6 ...

  9. 使用code::blocks搭建objective-c的IDE开发环境 支持 @interface

    网上有许多的关于 <使用code::blocks搭建objective-c的IDE开发环境>的文章. 大多是写了一个Helloworld 就结束了,今天试了试 添加了一个 @interfa ...

  10. Master Sudoku:Get The Skill

    自己做的小游戏 google play store: https://play.google.com/store/apps/details?id=com.ffipp.sodoku app store: ...