上传高德地图-express框架
2018-06-24 01:07:00来源:未知 阅读 ()
1.首先要注册高德地图,完后成为开发者
2.控制台里获取自己的key值
3.在要显示地图的页面添加如下的代码
<script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
<script src="//webapi.amap.com/ui/1.0/main.js"></script>
<div id="container" style="height: 600px"></div>
<script>
var toolBar;
var customMarker = new AMap.Marker({
offset: new AMap.Pixel(-14, -34),//相对于基点的位置
icon: new AMap.Icon({ //复杂图标
size: new AMap.Size(27, 36),//图标大小
image: "http://webapi.amap.com/images/custom_a_j.png", //大图地址
imageOffset: new AMap.Pixel(-28, 0)//相对于大图的取图位置
})
});
var map = new AMap.Map('container', {
resizeEnable: true,
zoom:11,
center: [116.397428, 39.90923]
});
AMap.plugin(['AMap.ToolBar','AMap.Scale','AMap.OverView'],
function(){
map.addControl(new AMap.ToolBar());
map.addControl(new AMap.Scale());
map.addControl(new AMap.OverView({isOpen:true}));
});
</script>
4.在登录后的页面头加入
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
<script src="http://webapi.amap.com/maps?v=1.4.2&key=您的key值"></script>
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:es6数组方法详解
- ?javascript如何控制上传文件的大小 2020-03-19
- jQuery Ajax使用FormData对象上传文件的方法 2019-11-10
- BootStrap使用file-input插件上传图片的方法 2019-09-08
- 前端笔记之微信小程序(三)GET请求案例&文件上传和 2019-08-14
- 前端笔记之React(八)上传&图片裁切 2019-08-14
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash