摘要:本篇教程介绍了JavaScript基础教程 百度地图API-javascript-web地图的应用,希望阅读本篇文章以后大家有所收获,帮助大家对JavaScript的理解更加深入。
本篇教程介绍了JavaScript基础教程 百度地图API-javascript-web地图的应用,希望阅读本篇文章以后大家有所收获,帮助大家对JavaScript的理解更加深入。
<
html部分的代码
<div class="maxwidth">
<div class="address clearfix">
<div class="map-box fl">
<div id="allmap"></div>
</div>
<div class="maptitle fr">
<span>建和塑胶材料有限公司</span>
<p>联系人:胡先生</p>
<p>电子邮箱:hudb@pvc123.com</p>
<p>联系地址:东莞市南城区高盛科技大厦5楼</p>
<div class="qqinline">
<a href="#">QQ在线咨询</a>
</div>
</div>
<div class="mapimg fr">
<img src="../static/conaaa.png" />
</div>
</div>
<div class="hot">
<img src="../static/hot.jpg" />
</div>
</div>
css部分代码
.maxwidth{width:1200px;margin:0px auto;}
/*map*/
.map-box{background-color:#fff;width:750px;height:538px;border:1px solid #eee;}
#allmap{width:730px;height:518px;margin:10px;}
span.BMap_Marker label.BMapLabel{border:1px solid #000;border-radius: 3px;}
/*map end*/
js部分代码
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="//api.map.baidu.com/api?ak=nbAwc69Hb3sgKdGHko1HWhSP&v=2.0"></script>
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");
var point = new BMap.Point(113.732756,22.992607);
map.centerAndZoom(point, 19);
var marker = new BMap.Marker(point); // 创建标注
map.addOverlay(marker); // 将标注添加到地图中
var label = new BMap.Label("建和塑胶材料有限公司",{offset:new BMap.Size(20,-10)});
label.setStyle({
borderColor : "black"
});
//marker.addEventListener("click", function(){ //点击弹出可去掉注释
marker.setLabel(label); //开启信息窗口
//}); //点击弹出可去掉注释
</script>
本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端JavaScript频道!
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了,明天再试试吧!
我们会在第一时间安排职业规划师联系您!
您也可以联系我们的职业规划师咨询:
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
沪公网安备 31011502005948号