TDataView_ui/scripts/mod/menu/myLayer.js

/**
 * [ONEMAP.M.projectController]
 * @return {[object]}
 */
define(['modDir/menu/myLayerActions'],
    function (_myLayerActions) {

        /**
         * 初始化并订阅事件
         * @return {[type]} [description]
         */

        function init(dm) {
            if (!status.initialized) {
                subscribe();
                bindEvent();
                status.initialized = true;
            }
        }

        function bindEvent() {

        }

        // 移除图层
        function removeLayer(data) {
            if (data) {
                modValue.thematicControlHtml.remove();
                map23DControl.tileLayer({
                    action: 'remove',
                    guid: data
                })
                data = null;
                // map2DViewer.map.removeControl(overLayerOpacityControl);
                overLayerOpacityControl = null;
            }

            ONEMAP.D.overLayerCount--;
            if (ONEMAP.D.overLayerCount == 0) {
                map2DViewer.map.setZoomScope(1, 19);
            }
        }

        /**
         * 设置界面
         */
        function setLayout() {

        }

        function layoutResize() {

        }

        // action type guid 
        function myLayerControl(options) {
            switch (options.action) {
                case 'add':
                    return addToMyLayer(options);
                    break;
                case 'remove':
                    return deleteDom(options);
                    break;
                case 'update':
                    return updateLayer(options);
                    break;
            }
        }


        // 添加到自定义图层
        function addToMyLayer(options) { // guid type(图层或图层组) name mod(是否无透明度)
            // console.log(options.layerData);
            // console.log("add");
            var layerLength = $("#layerControlMenu .myLayers li").length;
            if (layerLength < map23DConfig.layerMaxLength) {
                // console.log(layerLength);
                var DOMid = options.DOM.guid;
                var mnAct = '<div class="mn-act no" setOp="no">';
                if (options.DOM.type == "layer" || options.DOM.type == "otherOrigin" || options.DOM.type == "thematicOrigin" || options.DOM.type == "sxlayer") {
                    mnAct = '<div class="mn-act yes" setOp="yes">';
                } else if (options.mod == "taiShi") {
                    mnAct = '<div class="mn-act no taiShiTool" setOp="no">';
                } else if (options.mod == "wxjd") {
                    mnAct = '<div class="mn-act no" style="margin-left: 0px;" setOp="no">';
                }
                if (options.mod == "test") {
                    mnAct = '<div class="mn-act yes DS" setOp="yes">';
                }
                var data;
                var layerFloor = "zid" + DOMid;
                if (options.mod == "test") {
                    data = '<li layer="' + DOMid + '" class="' + layerFloor + '" cg="true"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true" class="' + DOMid + '">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name + '</span>'+
                        '<span class="data-save" guid="' + DOMid + '">' + JSON.stringify(options.layerData) + '</span>'+
                        '<span class="fr gear"></span></div>' + mnAct +
                        '<span>透明度：</span><span class="op"><span class="chang"></span>' +
                        '<span class="yuan" layer="' + DOMid + '"></span></span>' +
                        '<span class="layer-detail"></span><span class="layer-cale"></span>' +
                        '<span class="move"><span class="down"></span><span class="up"></span></span></div><span class="eye">显示开关</span></li>';
                    // 设置层级
                    setFloor(layerFloor, options.DOM.name);
                } else if (options.mod == "otherOrigin" || options.mod == "thematicOrigin" || options.mod == "qixiang" || options.mod == "vectorOrigin") {
                    data = '<li layer="' + DOMid + '" class="' + layerFloor + '" cg="true"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true" class="' + DOMid + '">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name +
                        '</span><span class="fr legend" title="图例" curl="' + options.DOM.legend + '"></span><span class="fr gear"></span></div>' + mnAct +
                        '<span>透明度：</span><span class="op"><span class="chang"></span>' +
                        '<span class="yuan" layer="' + DOMid + '"></span></span>' +
                        '<span class="move"><span class="down"></span><span class="up"></span></span></div><span class="eye">显示开关</span></li>';
                    // 设置层级
                    setFloor(layerFloor, options.DOM.name);
                } else if (options.mod == "taiShi") {
                    data = '<li layer="' + DOMid + '"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name +
                        '</span><span class="data-save"></span><span class="fr gear"></span></div>' + mnAct
                        // +'<span style="line-height:25px; ">用户ID:<input type="text"  id="video-query-ids"  style="width:114px;height: 25px;line-height: 20px;border: #7F9BB3 1px solid;margin-left: 5px;"  /></span>'
                        +
                        '<span style="line-height:25px; "><input type="text"  id="video-query-startDate"  class="Wdate" onfocus="WdatePicker({dateFmt:\'yyyy-MM-dd HH:mm:ss\',maxDate:\'#F{$dp.$D(\\\'video-query-endDate\\\')}\',readOnly:true});" />至</span>' +
                        '<span style="line-height:25px; "><input type="text"  id="video-query-endDate"  class="Wdate" onfocus="WdatePicker({dateFmt:\'yyyy-MM-dd HH:mm:ss\',minDate:\'#F{$dp.$D(\\\'video-query-startDate\\\')}\',readOnly:true});" /></span>' +
                        '<span style="line-height:25px; ">时间间隔:<input type="number"  value="1" style="width: 40px;height: 25px;line-height: 20px;font-size: 12px;border: #7F9BB3 1px solid;padding-left: 5px;margin-left: 5px;" id="video-timeSpace"  />小时<input type="button" id="taishi_setBtn" style="position:absolute;left:145px;height: 25px;line-height: 20px;text-align: center;vertical-align: middle;border: 0px !important; background: #104792;color: #fff;padding: 0px 5px 0px 5px;cursor: pointer;border-radius: 2px;" value="查询" /></span>' +
                        '</div><span class="eye">显示开关</span></li>';
                } else if (options.mod == "zhihuiji") {
                    data = '<li layer="' + DOMid + '"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name +
                        '</span><span class="data-save"></span><span class="fr gear"></span></div>' + mnAct +
                        '<p class="getHistoryZHJ" onclick="ONEMAP.M.projectController.openHistroyPosition()">历史轨迹查询</p></div><span class="eye">显示开关</span></li>';
                } else if (options.mod == "wxjd") {
                    data = '<li layer="' + DOMid + '"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name +
                        '</span><span class="data-save"></span><span class="fr gear"></span></div>' + mnAct
                        // +'<span style="line-height:30px; "><input type="radio" name="jd" id="wxjd-rdss"checked/>RDSS<input type="radio" id="wxjd-rnss" name="jd"/>RNSS<input type="radio" id="wxjd-gps" name="jd"/>GPS</span>'
                        +
                        '<span style="line-height:30px; "><input type="radio" id="wxjd-rnss" name="jd"/>RNSS<input type="radio" id="wxjd-gps" name="jd"/>GPS</span>' +
                        '</div><span class="eye">显示开关</span></li>';
                } else if (options.mod == "sxlayer") {
                    data = '<li layer="' + DOMid + '" class="' + DOMid + ' sxlayer" cg="true"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true" class="' + DOMid + '">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name +
                        '</span><span class="fr gear"></span></div>' + mnAct +
                        '<span>透明度：</span><span class="op"><span class="chang"></span>' +
                        '<span class="yuan" layer="' + DOMid + '"></span></span>' +
                        '</div><span class="eye">显示开关</span></li>';
                } else if (options.mod == "QXSY") {
                    data = '<li layer="' + DOMid + '"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true" class="' + DOMid + '">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name +
                        '</span><span class="data-save"></span></div><span class="eye">显示开关</span></li>';
                } else if (options.mod == "MOXING") {
                    data = '<li layer="' + DOMid + '"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true" class="' + DOMid + '">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name + '</span>'+
                        '<span class="data-save"></span>'+
                        '<span class="fr stereoscopic_set"></span>'+
                        '</div><span class="eye">显示开关</span></li>';
                } else {
                    data = '<li layer="' + DOMid + '" class="' + DOMid + '"><div class="clearfix"><span class="close">×</span>' +
                        '<input type="checkbox" checked="true">' +
                        '<span class="data-name" title="' + options.DOM.name + '">' + options.DOM.name +
                        '</span><span class="data-save"></span></div><span class="eye">显示开关</span></li>';
                }
                $("#layerControlMenu .myLayers .mn-content").prepend(data);
                $("#layerControlMenu .myLayers .mn-content").children(":first").find("input").next().html(options.DOM.name);
                $("#layerControlMenu .myLayers").addClass('active');
                $("#layerControlMenu .mn-content .mn-act").removeClass('active');
                $("#layerControlMenu .myLayers .mn-content").children(":first").find("input:checkbox").attr("checked", true);
                $("#layerControlMenu .myLayers .mn-content").children(":first").find(".eye").addClass("checkTrue");

                $("#layerControlMenu .myLayers .scroll-bar").mCustomScrollbar('update');

                _myLayerActions.init();

                // 判断图层控制是否显示
                if (!$("#layerControlMenu").hasClass("bl")) {
                    $("#layerControlMenu").addClass("bl");
                    $("#layerControlMenu .myLayers").addClass("active");
                }
                // 添加时窗口位置如未显示则重置
                if (parseInt($("#layerControlMenu").css("left")) < -100) {
                    $("#layerControlMenu").css("left", "0");
                }
                // 检查图层控制是否为空
                ONEMAP.M.layerControlMenu.checkLayerNull();

                return DOMid;
            } else {
                ONEMAP.C.publisher.publish({
                    type: 'warning',
                    message: '图层数量已达上限'
                }, 'noteBar::add');
            }
        }

        // 从我的图层中删除
        function deleteDom(options) {
            // DOMid
            var guid = options.DOMid;
            var li = $("#layerControlMenu .myLayers .mn-content li");
            for (var i = 0; i < li.length; i++) {
                // console.log(li.eq(i).attr("layer"));
                if (li.eq(i).attr("layer") == guid) {
                    li.eq(i).remove();
                }
            }
            ONEMAP.M.layerControlMenu.checkLayerNull(); // 检查我的图层是否为空
            ONEMAP.M.myLayerActions.changeFloor(); // 删除时更新层级
        }

        function updateLayer(options) {
            var guid = options.DOMid;
            var name = options.DOM.name;
            var li = $("#layerControlMenu .myLayers .mn-content li");
            for (var i = 0; i < li.length; i++) {
                if (li.eq(i).attr("layer") == guid) {
                    li.eq(i).find(".data-name").html(name);
                }
            }
        }

        // 设置层级
        function setFloor(DOMID, name) {
            var li = $("#layerControlMenu .myLayers .mn-content li");
            var liLength = li.length;
            var layer = $("#mapHolder #map2DWrap .leaflet-layer ");
            var layerLength = layer.length;
            for (var i = 0; i < liLength; i++) {
                li.eq(i).attr("zid", i);
            }
            layer.eq(layerLength - 1).addClass(DOMID);
            $("#mapHolder ." + DOMID).css("z-index", layerLength).attr("title", name);
        }
        // 检查当前图层数量
        function checkLength() {
            var layerLength = $("#layerControlMenu .myLayers li").length;
            return layerLength;
        }

        function addZoom(minZoom, maxZoom, lat, lng, zoom, guid) {
            if (!isNaN(minZoom)) {
                ONEMAP.C.zoomArr.push(minZoom);
            }
            if (!isNaN(maxZoom)) {
                ONEMAP.C.zoomArr.push(maxZoom);
            }
            setZoom(lat, lng, zoom);
            // console.log(guid);
            if (guid) {
                var arr2w = {
                    "name": guid,
                    "minZoom": minZoom,
                    "maxZoom": maxZoom
                }
                ONEMAP.C.zoomArr2w.push(arr2w);
            }
            // console.log(ONEMAP.C.zoomArr2w);
        }

        function deleteZoom(minZoom, maxZoom, guid) {
            if (minZoom) {
                ONEMAP.C.zoomArr.splice(jQuery.inArray(minZoom, ONEMAP.C.zoomArr), 1);
                ONEMAP.C.zoomArr.splice(jQuery.inArray(maxZoom, ONEMAP.C.zoomArr), 1);
            }

            if (guid) {
                // 删除一维数组对应
                var zoomArr2w = ONEMAP.C.zoomArr2w;
                for (var i = 0; i < zoomArr2w.length; i++) {
                    if (guid == zoomArr2w[i].name) {
                        ONEMAP.C.zoomArr.splice(jQuery.inArray(zoomArr2w[i].minZoom, ONEMAP.C.zoomArr), 1);
                        ONEMAP.C.zoomArr.splice(jQuery.inArray(zoomArr2w[i].maxZoom, ONEMAP.C.zoomArr), 1);
                    }
                }
                // 删除二维数组对应
                var newData = ONEMAP.C.zoomArr2w.filter(function (item) {
                    return item['name'] != guid;
                });
                ONEMAP.C.zoomArr2w = newData;
            }
            // console.log(ONEMAP.C.zoomArr);
            // console.log(ONEMAP.C.zoomArr2w);

            setZoom();
        }

        function setZoom(clat, clng, czoom) {
            var mxZ = Math.max.apply(null, ONEMAP.C.zoomArr);
            var mnZ = Math.min.apply(null, ONEMAP.C.zoomArr);
            // console.log(mxZ);
            // console.log(mnZ);
            // console.log(clat);
            // console.log(ONEMAP.C.zoomArr);
            setTimeout(function () {
                map2DViewer.map.setZoomScope(mnZ, mxZ);
            }, 500)


            if (clat) {
                map23DControl.setView({
                    center: {
                        lat: clat,
                        lng: clng
                    },
                    zoom: czoom
                })
            }
        }

        function zoomActions(action, minZoom, maxZoom, lat, lng, zoom, guid) {
            // console.log("act zoom")
            switch (action) {
                case 'add':
                    return addZoom(minZoom, maxZoom, lat, lng, zoom, guid);
                    break;
                case 'remove':
                    return deleteZoom(minZoom, maxZoom, guid);
                    break;
            }
        }

        /**
         * 注册订阅
         * @type {Function}
         * 推送：ONEMAP.C.publisher.publish(options,'moduleName::type');
         * 订阅：ONEMAP.C.publisher.subscribe(layoutResize,'sideBarLayoutChange');
         */
        function subscribe() {
            ONEMAP.C.publisher.subscribe(layoutResize, 'menuListClick');
            // ONEMAP.C.publisher.subscribe(remove, 'cleanMap');
        }

        /**
         * 取消订阅
         * @type {Function}
         * 取消订阅：ONEMAP.C.publisher.unSubscribe(layoutResize,'sideBarLayoutChange');
         */
        function unSubscribe() {

        }

        return ONEMAP.M.myLayers = {
            init: init,
            myLayerControl: myLayerControl,
            checkLength: checkLength,
            zoomActions: zoomActions
        }
    });