百度地图api接口配置,显示位置及电话

tech2025-07-10  3

百度地图api接口配置,显示位置及电话,效果如下:

废话不多说,直接上代码: 

<script src="http://api.map.baidu.com/api?v=2.0&amp;ak=2yj0orPscf4IFIGVG2nrlYRFrGNYozAh"></script><script type="text/javascript" src="http://api.map.baidu.com/getscript?v=2.0&amp;ak=2Ob1Cq4Ox2VLz1Dz1SHoHyjhECGsNWPr&amp;services=&amp;t=20200824135534"></script> <div id="m-baidu-map" style="overflow: hidden; position: relative; z-index: 0; background-color: rgb(243, 241, 236); color: rgb(0, 0, 0); text-align: left;"><div style="overflow: visible; position: absolute; z-index: 0; left: 0px; top: 0px; cursor: url(&quot;http://api0.map.bdimg.com/images/openhand.cur&quot;) 8 8, default;"><div class="BMap_mask" style="position: absolute; left: 0px; top: 0px; z-index: 9; overflow: hidden; user-select: none; width: 1152px; height: 350px;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 200;"><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 800;"><div class="BMap_pop" style="box-sizing: content-box; position: absolute; cursor: default; left: 427px; top: 48px;"><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 0px; top: 0px; width: 25px; height: 25px;"><div style="box-sizing:content-box;background:#fff;border-top:1px solid #ababab;border-left:1px solid #ababab;width:30px;height:30px;"></div></div><div class="BMap_top" style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 25px; top: 0px; width: 282px; height: 25px;"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 307px; top: 0px; width: 25px; height: 25px;"><div style="box-sizing:content-box;position:absolute;top:0;left:-6px;background:#fff;border-top:1px solid #ababab;border-right:1px solid #ababab;width:30px;height:30px;"></div></div><div class="BMap_center" style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 0px; top: 25px; width: 330px; height: 53px;"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 0px; top: 78px; width: 25px; height: 25px;"><div style="box-sizing:content-box;position:absolute;top:-6px;left:0;background:#fff;border-bottom:1px solid #ababab;border-left:1px solid #ababab;width:30px;height:30px;"></div></div><div class="BMap_bottom" style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 25px; top: 78px; width: 282px; height: 24px;"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 307px; top: 78px; width: 25px; height: 25px;"><div style="box-sizing:content-box;position:absolute;top:-6px;left:-6px;background:#fff;border-right:1px solid #ababab;border-bottom:1px solid #ababab;width:30px;height:30px;"></div></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 149px; top: 78px; width: 34px; height: 50px;"><img style="box-sizing:content-box;border:none;margin:0px;padding:0px;margin-left:-186px;margin-top:-691px;max-width:none; width:690px;height:786px;" src="http://api0.map.bdimg.com/images/iw3.png"></div><div style="box-sizing: content-box; width: 300px; height: 71px; position: absolute; left: 16px; top: 16px; z-index: 10; overflow: hidden;"><div class="BMap_bubble_title" style="display: none; overflow: hidden; height: auto; line-height: 24px; white-space: nowrap; width: auto;"></div><div class="BMap_bubble_max_content" style="display:none;position:relative"></div></div><img style="position: absolute; top: 12px; width: 10px; height: 10px; cursor: pointer; z-index: 10000; left: 307px;" src="http://api0.map.bdimg.com/images/iw_close1d3.gif"><img style="position:absolute;top:12px;width:10px;height:10px;-moz-user-select:none;cursor:pointer;z-index:10000;display:none" src="http://api0.map.bdimg.com/images/quanjing.png" title="进入全景"><img style="position:absolute;top:10px;width:9px;height:14px;-moz-user-select:none;cursor:pointer;z-index:10000;display:none;" src="http://api0.map.bdimg.com/images/phone.png" title="发送到手机"><img style="position: absolute; top: 12px; width: 10px; height: 10px; cursor: pointer; z-index: 10000; display: none; left: 287px;" src="http://api0.map.bdimg.com/images/iw_plus1d3.gif"><div style="position: absolute; top: 0px; left: 0px; z-index: 10000; width: 332px;"></div></div></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 700;"><span class="BMap_Marker BMap_noprint" unselectable="on" "="" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; background: url(&quot;http://api0.map.bdimg.com/images/blank.gif&quot;); width: 19px; height: 25px; left: 566px; top: 150px; z-index: -4532030; user-select: none;" title=""></span><span class="BMap_Marker BMap_noprint" unselectable="on" "="" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; background: url(&quot;http://api0.map.bdimg.com/images/blank.gif&quot;); width: 19px; height: 25px; left: 566px; top: 150px; z-index: -4532030; user-select: none;" title=""></span><span class="BMap_Marker BMap_noprint" unselectable="on" "="" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; background: url(&quot;http://api0.map.bdimg.com/images/blank.gif&quot;); width: 1px; height: 1px; left: 576px; top: 175px; z-index: -4532030; user-select: none;" title=""></span><span class="BMap_Marker BMap_noprint" unselectable="on" "="" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; background: url(&quot;http://api0.map.bdimg.com/images/blank.gif&quot;); width: 19px; height: 25px; left: 566px; top: 150px; z-index: -4532030; user-select: none;" title=""></span><span class="BMap_Marker BMap_noprint" unselectable="on" "="" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; background: url(&quot;http://api0.map.bdimg.com/images/blank.gif&quot;); width: 19px; height: 25px; left: 566px; top: 150px; z-index: -4532030; user-select: none;" title=""></span><span class="BMap_Marker BMap_noprint" unselectable="on" "="" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; background: url(&quot;http://api0.map.bdimg.com/images/blank.gif&quot;); width: 18px; height: 18px; left: 867px; top: 299px; z-index: 19000000; user-select: none; display: none;" title=""></span></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 600;"><div class="BMap_shadow" style="position: absolute; left: 405px; top: 100px;" type="infowindow_shadow"><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 44px; top: 0px; width: 70px; height: 30px;"><img onmousedown="return false" style="margin-left: -323px; margin-top: 0px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 114px; top: 0px; width: 243px; height: 30px;"><img onmousedown="return false" style="margin-left: -393px; margin-top: 0px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 357px; top: 0px; width: 70px; height: 30px;"><img onmousedown="return false" style="margin-left: -1033px; margin-top: 0px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 29px; top: 30px; width: 85px; height: 15px;"><img onmousedown="return false" style="margin-top: -30px; margin-left: -308px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 114px; top: 30px; width: 257px; height: 15px;"><img onmousedown="return false" style="margin-left: -360px; margin-top: -30px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 371px; top: 30px; width: 85px; height: 15px;"><img onmousedown="return false" style="margin-top: -30px; margin-left: -1048px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 0px; top: 45px; width: 50px; height: 60px;"><img onmousedown="return false" style="margin-left: -14px; margin-top: -310px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 50px; top: 45px; width: 51px; height: 60px;"><img onmousedown="return false" style="margin-left: -255px; margin-top: -310px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 101px; top: 45px; width: 140px; height: 60px;"><img onmousedown="return false" style="margin-left: -440px; margin-top: -310px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 241px; top: 45px; width: 101px; height: 60px;"><img onmousedown="return false" style="margin-left: -255px; margin-top: -310px;" src="http://api0.map.bdimg.com/images/iws3.png"></div><div style="box-sizing: content-box; overflow: hidden; z-index: 1; position: absolute; left: 342px; top: 45px; width: 70px; height: 60px;"><img onmousedown="return false" style="margin-left: -754px; margin-top: -310px;" src="http://api0.map.bdimg.com/images/iws3.png"></div></div></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 500;"><label class="BMapLabel" unselectable="on" style="position: absolute; display: none; cursor: inherit; background-color: rgb(190, 190, 190); border: 1px solid rgb(190, 190, 190); padding: 1px; white-space: nowrap; font: 12px arial, sans-serif; z-index: -20000; color: rgb(190, 190, 190);">shadow</label><label class="BMapLabel" unselectable="on" style="position: absolute; display: none; cursor: inherit; background-color: rgb(255, 255, 225); border: 1px solid rgb(140, 140, 140); padding: 1px; white-space: nowrap; font: 12px arial, sans-serif; z-index: 80; user-select: none; color: rgb(77, 77, 77);">点击可查看详情</label></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 400;"><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: 566px; top: 150px; z-index: -4532030;"><div style="position: absolute; margin: 0px; padding: 0px; width: 19px; height: 25px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:0px; margin-top:0px; "></div></span><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: 566px; top: 150px; z-index: -4532030;"><div style="position: absolute; margin: 0px; padding: 0px; width: 19px; height: 25px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:0px; margin-top:0px; "></div></span><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: 576px; top: 175px; z-index: -4532030;"><div style="position: absolute; margin: 0px; padding: 0px; width: 1px; height: 1px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/blank.gif" style="display: block; border:none;margin-left:0px; margin-top:0px; "></div></span><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: 566px; top: 150px; z-index: -4532030;"><div style="position: absolute; margin: 0px; padding: 0px; width: 19px; height: 25px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:0px; margin-top:0px; "></div></span><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: 566px; top: 150px; z-index: -4532030;"><div style="position: absolute; margin: 0px; padding: 0px; width: 19px; height: 25px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:0px; margin-top:0px; "></div></span><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: 867px; top: 299px; z-index: 19000000; display: none;"><div style="position: absolute; margin: 0px; padding: 0px; width: 18px; height: 18px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/spotmkrs.png" style="display: block; border:none;margin-left:-166px; margin-top:0px; "></div></span></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 300;"><span unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 20px; height: 11px; left: 570px; top: 164px;"><div style="position: absolute; margin: 0px; padding: 0px; width: 20px; height: 11px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:-19px; margin-top:-13px; "></div></span><span unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 20px; height: 11px; left: 570px; top: 164px;"><div style="position: absolute; margin: 0px; padding: 0px; width: 20px; height: 11px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:-19px; margin-top:-13px; "></div></span><span unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 20px; height: 11px; left: 570px; top: 164px;"><div style="position: absolute; margin: 0px; padding: 0px; width: 20px; height: 11px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:-19px; margin-top:-13px; "></div></span><span unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 20px; height: 11px; left: 570px; top: 164px;"><div style="position: absolute; margin: 0px; padding: 0px; width: 20px; height: 11px; overflow: hidden;"><img src="http://api0.map.bdimg.com/images/marker_red_sprite.png" style="display: block; border:none;margin-left:-19px; margin-top:-13px; "></div></span></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 201;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 200;"></div></div><div style="position: absolute; overflow: visible; top: 0px; left: 0px; z-index: 1;"><div style="position: absolute; overflow: visible; z-index: -100; left: 576px; top: 175px; display: block; transform: translate3d(0px, 0px, 0px);"><img src="http://maponline3.bdimg.com/tile/?qt=vtile&amp;x=1550&amp;y=313&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: 43px; top: 65px; max-width: none; opacity: 1;"><img src="http://maponline3.bdimg.com/tile/?qt=vtile&amp;x=1549&amp;y=314&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: -213px; top: -191px; max-width: none; opacity: 1;"><img src="http://maponline2.bdimg.com/tile/?qt=vtile&amp;x=1548&amp;y=314&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: -469px; top: -191px; max-width: none; opacity: 1;"><img src="http://maponline2.bdimg.com/tile/?qt=vtile&amp;x=1552&amp;y=314&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: 555px; top: -191px; max-width: none; opacity: 1;"><img src="http://maponline2.bdimg.com/tile/?qt=vtile&amp;x=1549&amp;y=313&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: -213px; top: 65px; max-width: none; opacity: 1;"><img src="http://maponline0.bdimg.com/tile/?qt=vtile&amp;x=1547&amp;y=313&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: -725px; top: 65px; max-width: none; opacity: 1;"><img src="http://maponline1.bdimg.com/tile/?qt=vtile&amp;x=1547&amp;y=314&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: -725px; top: -191px; max-width: none; opacity: 1;"><img src="http://maponline1.bdimg.com/tile/?qt=vtile&amp;x=1548&amp;y=313&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: -469px; top: 65px; max-width: none; opacity: 1;"><img src="http://maponline0.bdimg.com/tile/?qt=vtile&amp;x=1550&amp;y=314&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: 43px; top: -191px; max-width: none; opacity: 1;"><img src="http://maponline1.bdimg.com/tile/?qt=vtile&amp;x=1551&amp;y=314&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: 299px; top: -191px; max-width: none; opacity: 1;"><img src="http://maponline0.bdimg.com/tile/?qt=vtile&amp;x=1551&amp;y=313&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: 299px; top: 65px; max-width: none; opacity: 1;"><img src="http://maponline1.bdimg.com/tile/?qt=vtile&amp;x=1552&amp;y=313&amp;z=13&amp;styles=pl&amp;scaler=1&amp;udt=20200827&amp;from=jsapi2_0" style="position: absolute; border: none; width: 256px; height: 256px; left: 555px; top: 65px; max-width: none; opacity: 1;"></div></div><div style="position: absolute; overflow: visible; top: 0px; left: 0px; z-index: 2; display: none;"><div style="position: absolute; overflow: visible; top: 0px; left: 0px; z-index: 0; display: none;"></div></div><div style="position: absolute; overflow: visible; top: 0px; left: 0px; z-index: 3;"></div></div><div class="pano_close" title="退出全景" style="z-index: 1201; display: none;"></div><a class="pano_pc_indoor_exit" title="退出室内景" style="z-index: 1201; display: none;"><span style="float:right;margin-right:12px;">出口</span></a><div id="zoomer" style="position:absolute;z-index:0;top:0px;left:0px;overflow:hidden;visibility:hidden;cursor:url(http://api0.map.bdimg.com/images/openhand.cur) 8 8,default"><div class="BMap_zoomer" style="top:0;left:0;"></div><div class="BMap_zoomer" style="top:0;right:0;"></div><div class="BMap_zoomer" style="bottom:0;left:0;"></div><div class="BMap_zoomer" style="bottom:0;right:0;"></div></div><div unselectable="on" class=" BMap_stdMpCtrl BMap_stdMpType0 BMap_noprint anchorTL" style="width: 62px; height: 186px; bottom: auto; right: auto; top: 10px; left: 10px; position: absolute; z-index: 1100; text-size-adjust: none;"><div class="BMap_stdMpPan"><div class="BMap_button BMap_panN" title="向上平移"></div><div class="BMap_button BMap_panW" title="向左平移"></div><div class="BMap_button BMap_panE" title="向右平移"></div><div class="BMap_button BMap_panS" title="向下平移"></div><div class="BMap_stdMpPanBg BMap_smcbg"></div></div><div class="BMap_stdMpZoom" style="height: 141px; width: 62px;"><div class="BMap_button BMap_stdMpZoomIn" title="放大一级"><div class="BMap_smcbg"></div></div><div class="BMap_button BMap_stdMpZoomOut" title="缩小一级" style="top: 120px;"><div class="BMap_smcbg"></div></div><div class="BMap_stdMpSlider" style="height: 102px;"><div class="BMap_stdMpSliderBgTop" style="height: 102px;"><div class="BMap_smcbg"></div></div><div class="BMap_stdMpSliderBgBot" style="top: 37px; height: 69px;"></div><div class="BMap_stdMpSliderMask" title="放置到此级别"></div><div class="BMap_stdMpSliderBar" title="拖动缩放" style="cursor: url(&quot;http://api0.map.bdimg.com/images/openhand.cur&quot;) 8 8, default; top: 37px;"><div class="BMap_smcbg"></div></div></div><div class="BMap_zlHolder"><div class="BMap_zlSt"><div class="BMap_smcbg"></div></div><div class="BMap_zlCity"><div class="BMap_smcbg"></div></div><div class="BMap_zlProv"><div class="BMap_smcbg"></div></div><div class="BMap_zlCountry"><div class="BMap_smcbg"></div></div></div></div><div class="BMap_stdMpGeolocation" style="position: initial; display: none; margin-top: 43px; margin-left: 10px;"><div class="BMap_geolocationContainer" style="position: initial; width: 24px; height: 24px; overflow: hidden; margin: 0px; box-sizing: border-box;"><div class="BMap_geolocationIconBackground" style="width: 24px; height: 24px; background-image: url(http://api0.map.bdimg.com/images/navigation-control/geolocation-control/pc/bg-20x20.png); background-size: 20px 20px; background-position: 3px 3px; background-repeat: no-repeat;"><div class="BMap_geolocationIcon" style="position: initial; width: 24px; height: 24px; cursor: pointer; background-image: url('http://api0.map.bdimg.com/images/navigation-control/geolocation-control/pc/success-10x10.png'); background-size: 10px 10px; background-repeat: no-repeat; background-position: center;"></div></div></div></div></div><div class=" anchorBL" style="height: 32px; position: absolute; z-index: 30; text-size-adjust: none; bottom: 20px; right: auto; top: auto; left: 1px;"><a title="到百度地图查看此区域" target="_blank" href="http://map.baidu.com/?sr=1" style="outline: none;"><img style="border:none;width:77px;height:32px" src="http://api0.map.bdimg.com/images/copyright_logo.png"></a></div><div unselectable="on" class=" BMap_cpyCtrl BMap_noprint anchorBL" style="cursor: default; white-space: nowrap; color: black; background: none; font: 11px / 15px arial, sans-serif; bottom: 2px; right: auto; top: auto; left: 2px; position: absolute; z-index: 10; text-size-adjust: none;"><span _cid="1" style="display: inline;"><span style="background: rgba(255, 255, 255, 0.701961);padding: 0px 1px;line-height: 16px;display: inline;height: 16px;">©&nbsp;2020 Baidu</span></span></div></div> <script type="text/javascript"> // 创建地图 var map = new BMap.Map("m-baidu-map"); // 创建需要显示信息框 var mapBoxShow = '<p title="北京故宫" style="width:300px;display:block;font:bold 14px/16px arial,simsun,sans-serif;margin-bottom:5px;color:#cc5522;white-space:nowrap;overflow:hidden">北京故宫</p>' + "<p style='padding-right:10px;width:100%;word-break: break-all;font-size: 14px;'>地址:北京市东城区景山前街4号 故宫博物院</p>" + "<p style='padding-right:10px;width:220px;word-break: break-all;font-size: 14px;'>电话:010-85007063</p>" + "" + "</div>"; // 增加左侧控制条 map.addControl(new BMap.NavigationControl()); // 编写自定义函数,创建标注 function addMarker(point, content) { // 创建标注 var marker = new BMap.Marker(point); map.addOverlay(marker); var infoWindow = new BMap.InfoWindow(content); //开启信息窗口 map.openInfoWindow(infoWindow, point); marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); //图片加载完毕重绘infowindow document.getElementById('imgDemo').onload = function () { infoWindow.redraw(); } }); } var myLocalsearch = new BMap.LocalSearch( map, { onSearchComplete: function (results) { var poi = results.getPoi(0); map.centerAndZoom(poi.point, 13); var user_marker = new BMap.Marker(poi.point); map.addOverlay(user_marker); addMarker(poi.point, mapBoxShow); } } ); myLocalsearch.search("北京市东城区景山前街4号 故宫博物院"); </script>

以上代码只需修改公司名称、电话、地址及倒数第二行地址即可,无需引入其他js。希望对您有所帮助。

 

最新回复(0)