服务器广告宣传图
  • 建站小子微信

企业网站中如何添加调用百度地图标记

作者:创始人时间:2022-05-03 09:48:18 阅读数:0人阅读

  企业网站中使用地图可以帮助客户更好的找到我们,这是一个非常方便的功能,小编在给公司做网站时,就遇到了这个问题,下面把百度地图标记代码分享给大家。

84c59bd005bbdfdc0640772e5b25df98

  1、需要调用的js:

<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>

  这是调用百度地图需要的js代码,使用的仍然是1.4的版本

  2、页面中的代码:

<!-- mail -->
    <div class="mail mail-map">
        <div class="container">
            <div class="mail_grids">
                    <div id="allmap">
                        <script>
                            var map = new BMap.Map("allmap");            // 创建Map实例
                            var point = new BMap.Point(113.91228, 35.239491); // 创建点坐标
                            map.centerAndZoom(point,15);                 // 初始化地图,设置中心点坐标和地图级别。
                            map.enableScrollWheelZoom();                 //启用滚轮放大缩小
                            map.addControl(new BMap.NavigationControl());
                            map.addControl(new BMap.ScaleControl());
                            map.addControl(new BMap.OverviewMapControl());
                            var marker = new BMap.Marker(point);
                            map.addOverlay(marker);
                            var infoWinOpts = {}
                            var infoWin = new BMap.InfoWindow(
                                "<div style='text-align:left;color:#1A6DAF;'><p>公司名称</p><p>联系方式</p><p>地址</p></div>",infoWinOpts);
                            marker.openInfoWindow(infoWin);
                            marker.addEventListener("click", function(){this.openInfoWindow(infoWin);});
                        </script>
                    </div>
            </div>
        </div>
    </div>
<!-- //mail -->

       在上面的代码中,重要的是<div id="allmap">部分,大家可以把这部分放到自身网站合适的位置。“var point”是定义点坐标,大家可以使用百度的坐标拾取系统,找到自己公司的坐标。并将代码中的公司名称等信息修改为自己的。


本站所有文章、数据、图片均来自互联网,一切版权均归源网站或源作者所有。

如果侵犯了你的权益请来信告知我们删除。邮箱:8951154@qq.com

标签:
建站小子头像

建站小子

Hi~如果您正好看到这里,可以扫一扫微信二维码加我为好友,我是一个喜欢交朋友的人,我知道您也是哦~

微信
阿里云

猜你喜欢