百度地图如何放到页面上

<script type="text/javascript"  src="http://api.map.baidu.com/api?v=3.0&ak=mdzmIQ4Ul96GBgVDEPH6lCs5NdInAnQH"></script>

 <div id="container" style="width: 100%;height: 468px;"></div>

  地图图标

  var myIcon1 = new BMap.Icon("./images/map3.png", new BMap.Size(64, 64))

   var myIcon2 = new BMap.Icon("./images/map4.png", new BMap.Size(64, 64))

地图位置

 var point1 = new BMap.Point(121.437598, 31.211908);

    // 上海国盛集团仁源企业管理有限公司

  地图初始化

    var map = new BMap.Map("container", {

        enableBizAuthLogo: false

    });

    地图初始化展示位置与展示放大缩小级别

    map.centerAndZoom(point1, 13);

    map.enableScrollWheelZoom(true);

   添加坐标

map.addOverlay(new BMap.Marker(point1, { icon: myIcon1 }));

map.addOverlay(new BMap.Marker(point6, { icon: myIcon1 }));

map.addOverlay(new BMap.Marker(point7, { icon: myIcon1 }));

map.addOverlay(new BMap.Marker(point8, { icon: myIcon1 }));

点击按钮地图跳转到对应坐标位置

  $('.weizhi .wz_box:nth-child(-n+5)').click(function () {

        map.addOverlay(new BMap.Marker(point1, { icon: myIcon2 }));

        map.setCenter(point1)

        map.centerAndZoom(point1, 15);

    })

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。