systemMap.js 3.05 KB
;(function (window) {
    var sysMapObj = null;

    var mapApp = function (selector, lon = 113.34693, lat = 28.21849) {
        return new mapApp.fn.init(selector, lon, lat);
    }

    mapApp.fn = mapApp.prototype = {
        constructor: mapApp,

        init: function (selector, lon, lat) {
            this.selector = selector;
            this.lon = lon;
            this.lat = lat;
            this.initMap = function () {
                return this.initMapMethod();
            }

            this.createMarkerInfo = function (message,obj) {
                return this.markerInfoMethod(message, obj)
            }
        },

        initMapMethod () {
            if (document.querySelector("#" + this.selector).length == 0) {
                alert(`初始化方法元素节点${"#" + this.selector}不存在!`);
                return;
            }
            sysMapObj = new BMapGL.Map(this.selector);

            sysMapObj.centerAndZoom(this.getPoint(), 12);   //设置中心点
            sysMapObj.enableScrollWheelZoom(true); // //开启鼠标滚轮缩放

            var scaleCtrl = new BMapGL.ScaleControl();  // 添加比例尺控件
            sysMapObj.addControl(scaleCtrl);

            var zoomCtrl = new BMapGL.ZoomControl();  // 添加缩放控件
            sysMapObj.addControl(zoomCtrl);

            var cityCtrl = new BMapGL.CityListControl();  // 添加城市列表控件
            sysMapObj.addControl(cityCtrl);

            var locationCtrl = new BMapGL.LocationControl({
                anchor: BMAP_ANCHOR_BOTTOM_RIGHT,
                offset: new BMapGL.Size(10, 80)
            });;
            sysMapObj.addControl(locationCtrl);// 添加定位控件

            //sysMapObj.setHeading(64.5);
            //sysMapObj.setTilt(73);
            return this;
        },
        /**
         * 创建标注和信息框
         * obj {  title: x,  longitude: longitude, latitude:latitude }
         */
        markerInfoMethod: function (message, obj) {
            var point = this.getPoint(obj.longitude, obj.latitude)
            var marker = new BMapGL.Marker(point);      // 创建标注
            sysMapObj.addOverlay(marker);              // 将标注添加到地图中
            var opts = {
                width: 300,     // 信息窗口宽度
                height: 100,     // 信息窗口高度
                title: obj.title, // 信息窗口标题
            }
            var infoWindow = new BMapGL.InfoWindow(message, opts);  // 创建信息窗口对象 
            sysMapObj.openInfoWindow(infoWindow, point); //开启信息窗口
            marker.addEventListener("click", function () {
                sysMapObj.openInfoWindow(infoWindow, point); //开启信息窗口
            });

            return this;
        },

        getPoint(lon, lat) {
            var longitude = lon ?? this.lon;
            var latitude = lat ?? this.lat;
            var point = new BMapGL.Point(longitude, latitude);
            return point;
        }
    }

    mapApp.fn.init.prototype = mapApp.fn;

    window.mapApp = mapApp;
})(window, undefined);