Springboot+LayUI使用百度地图显示多个地点

因工作业务需要，使用百度地图API，通过输入多个地点的经纬度，显示在百度地图上，并结合springboot+layui进行展示
页面模板用的是freemarker。

JS代码：

<script type="text/javascript">
    var markerArr = [
        {title: "名称：宜阳恒丰园烩面馆", point: "112.182404, 34.52419", address: "宜阳县文明路恒丰园食府", tel: "未知"},
        {title: "名称：宜阳钓鱼岛酒店", point: "112.194981,34.521459", address: "洛阳宜阳县城关镇红旗中路 ", tel: "未知"},
        {title: "名称：宜阳锦龙喜宴酒店", point: "112.1996,34.5269", address: "宜阳县城关镇锦龙大道锦龙广场内", tel: "未知"},
        {title: "名称：百姓厨房", point: "112.196712,34.521718", address: "洛阳宜阳县城关镇红旗中路与丰源路交叉口", tel: "未知"}
    ];
    var map; //Map实例
    function map_init() {
        map = new BMap.Map("map");
        //第1步：设置地图中心点，宜阳钓鱼岛酒店
        var point = new BMap.Point(112.194981, 34.521459);
        //第2步：初始化地图,设置中心点坐标和地图级别。
        map.centerAndZoom(point, 11);
        //第3步：启用滚轮放大缩小
        map.enableScrollWheelZoom(true);
        //第4步：向地图中添加缩放控件
        var ctrlNav = new window.BMap.NavigationControl({
            anchor: BMAP_ANCHOR_TOP_LEFT,
            type: BMAP_NAVIGATION_CONTROL_LARGE
        });
        map.addControl(ctrlNav);
        //第5步：向地图中添加缩略图控件
        var ctrlOve = new window.BMap.OverviewMapControl({
            anchor: BMAP_ANCHOR_BOTTOM_RIGHT,
            isOpen: 1
        });
        map.addControl(ctrlOve);
        //第6步：向地图中添加比例尺控件
        var ctrlSca = new window.BMap.ScaleControl({
            anchor: BMAP_ANCHOR_BOTTOM_LEFT
        });
        map.addControl(ctrlSca);
        //第7步：绘制点
        for (var i = 0; i < markerArr.length; i++) {
            var p0 = markerArr[i].point.split(",")[0];
            var p1 = markerArr[i].point.split(",")[1];
            var maker = addMarker(new window.BMap.Point(p0, p1), i);
            addInfoWindow(maker, markerArr[i], i);
        }
    }
    // 添加标注
    function addMarker(point, index) {
        var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {
            offset: new BMap.Size(10, 25),
            imageOffset: new BMap.Size(0, 0 - index * 25)
        });
        var marker = new BMap.Marker(point, {icon: myIcon});
        map.addOverlay(marker);
        return marker;
    }
    // 添加信息窗口
    function addInfoWindow(marker, poi) {
        //pop弹窗标题
        var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + poi.title + '<\/div>';
        //pop弹窗信息
        var html = [];
        html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');
        html.push('<tr>');
        html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:<\/td>');
        html.push('<td style="vertical-align:top;line-height:16px">' + poi.address + ' <\/td>');
        html.push('<\/tr>');
        html.push('<\/tbody><\/table>');
        var infoWindow = new BMap.InfoWindow(html.join(""), {title: title, width: 200});
        var openInfoWinFun = function () {
            marker.openInfoWindow(infoWindow);
        };
        marker.addEventListener("mouseover", openInfoWinFun);
        return openInfoWinFun;
    }
    //异步调用百度js
    function map_load() {
        var load = document.createElement("script");
        load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";
        document.body.appendChild(load);
    }
    window.onload = map_load;
</script>

完成以上代码后，打开页面即可看到百度地图，已经刚刚添加4个地点，鼠标移入的时候能够展示出信息。但是这时候有一个不是很好看的地方，那就是地图左下角有一个百度地图的logo和一行文字。如何去掉呢？通过css样式隐藏掉，在 标签内添加css样式：

<#--  删除百度地图左下角的logo以及文字  -->
<style type="text/css">
    .BMap_cpyCtrl,
    .anchorBL {
        display: none;
    }
</style>