码迷,mamicode.com
首页 > Web开发 > 详细

上传高德地图-express框架

时间:2017-12-22 18:32:36      阅读:197      评论:0      收藏:0      [点我收藏+]

标签:图标   set   UI   container   express   tool   pix   开发者   styles   

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>

上传高德地图-express框架

标签:图标   set   UI   container   express   tool   pix   开发者   styles   

原文地址:http://www.cnblogs.com/ddnh/p/8087005.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!