空间分析选择图层下拉数据和样式

liuyg

2021-06-23 70d097137d08bf1a79943fb44b7086b4d45aac75

空间分析选择图层下拉数据和样式

 widgets/LeftNavigationBar/Widget.js

@@ -377,6 +377,7 @@
                                        obj.data.children.forEach(item => {
                                            Cesium.when(that[item.id], function (layer) {
                                                topic.publish('removeTilt', 'Layermanagement', item);
                                                topic.publish('removeTiltS', 'Layermanagement', item);
                                                topic.publish('removeLayersLegends', 'legends', item);
                                                that.map.scene.layers.remove(layer[0].name)
                                            })
@@ -388,6 +389,7 @@
                                                autoSetView: false //不自动定位
                                            });
                                            topic.publish('appendTilt', 'Layermanagement', item);
                                            topic.publish('appendTiltS', 'Layermanagement', item);
                                            topic.publish('addLayersLegends', 'legends', item);
                                            //定位到场景
                                            Cesium.loadJson(host + partOfUrl + '/scenes.json').then(function (scenes) {
@@ -430,6 +432,7 @@
                                                    });
                                                });
                                                topic.publish('appendItem', 'Layermanagement', item, that[item.id]);
                                                topic.publish('appendItemS', 'Layermanagement', item, that[item.id]);
                                                topic.publish('addLayersLegends', 'legends', item);
                                            } else {
                                                $.ajax({
@@ -443,6 +446,7 @@
                                                            url: res[0].path,
                                                        }));
                                                        topic.publish('appendItem', 'Layermanagement', item, that[item.id]);
                                                        topic.publish('appendItemS', 'Layermanagement', item, that[item.id]);
                                                        topic.publish('addLayersLegends', 'legends', item);
                                                        that[item.id].alpha = item.alpha;
                                                        that[item.id].getViewableRectangle().then(function (rectangle) {
@@ -468,6 +472,7 @@
                                        obj.data.children.forEach(item => {
                                            Cesium.when(that[item.id], function (layer) {
                                                topic.publish('removeTilt', 'Layermanagement', item);
                                                topic.publish('removeTiltS', 'Layermanagement', item);
                                                topic.publish('removeLayersLegends', 'legends', item);
                                                that.map.scene.layers.remove(layer[0].name)
                                            })
@@ -476,6 +481,7 @@
                                        obj.data.children.forEach(item => {
                                            if (that[item.id]) {
                                                topic.publish('removeItem', 'Layermanagement', item);
                                                topic.publish('removeItemS', 'Layermanagement', item);
                                                topic.publish('removeLayersLegends', 'legends', item);
                                                that[item.id].show = false;
                                            }
@@ -494,6 +500,7 @@
                                    if (obj.data.model) {
                                        Cesium.when(that[obj.data.id], function (layer) {
                                            topic.publish('removeTilt', 'Layermanagement', obj.data);
                                            topic.publish('removeTiltS', 'Layermanagement', obj.data);
                                            topic.publish('removeLayersLegends', 'legends', obj.data);
                                            that.map.scene.layers.remove(layer[0].name)
                                        })
@@ -508,6 +515,7 @@
                                            autoSetView: false //不自动定位
                                        });
                                        topic.publish('appendTilt', 'Layermanagement', obj.data);
                                        topic.publish('appendTiltS', 'Layermanagement', obj.data);
                                        topic.publish('addLayersLegends', 'legends', obj.data);
                                        //定位到场景
                                        Cesium.loadJson(host + partOfUrl + '/scenes.json').then(function (scenes) {
@@ -545,6 +553,7 @@
                                                });
                                            });
                                            topic.publish('appendItem', 'Layermanagement', obj.data, that[obj.data.id]);
                                            topic.publish('appendItemS', 'Layermanagement', obj.data, that[obj.data.id]);
                                            topic.publish('addLayersLegends', 'legends', obj.data);
                                        } else {
                                            $.ajax({
@@ -559,6 +568,7 @@
                                                    }));

                                                    topic.publish('appendItem', 'Layermanagement', obj.data, that[obj.data.id]);
                                                    topic.publish('appendItemS', 'Layermanagement', obj.data, that[obj.data.id]);
                                                    topic.publish('addLayersLegends', 'legends', obj.data);

                                                    that[obj.data.id].alpha = obj.data.alpha
@@ -583,6 +593,7 @@
                                        Cesium.when(that[obj.data.id], function (layer) {

                                            topic.publish('removeTilt', 'Layermanagement', obj.data);
                                            topic.publish('removeTiltS', 'Layermanagement', obj.data);
                                            topic.publish('removeLayersLegends', 'legends', obj.data);
                                            that.map.scene.layers.remove(layer[0].name)
                                        })
@@ -591,6 +602,7 @@

                                        if (that[obj.data.id]) {
                                            topic.publish('removeItem', 'Layermanagement', obj.data);
                                            topic.publish('removeItemS', 'Layermanagement', obj.data);
                                            topic.publish('removeLayersLegends', 'legends', obj.data);
                                            that[obj.data.id].show = false;
                                        }

 widgets/digTheEarth/Widget.js

@@ -28,7 +28,7 @@
                })

                $("#beginigTheEarth").click(()=>{
                    that.beginDigTheEarth();
                    that.beginDigTheEarth(); 

                })
            },
@@ -117,15 +117,16 @@
                });
                handlerPolygon.activate();
                document.getElementById("cleardigTheEarth").onclick = function () {
                    viewer.scene.globe.removeAllExcavationRegion();
                    if (handlerPolygon.polygon) {
                        handlerPolygon.polygon.show = false;
                    }
                    if (handlerPolygon.polyline) {
                        handlerPolygon.polyline.show = false;
                    }
                    // viewer.scene.globe.removeAllExcavationRegion();
                    // if (handlerPolygon.polygon) {
                    //     handlerPolygon.polygon.show = false;
                    // }
                    // if (handlerPolygon.polyline) {
                    //     handlerPolygon.polyline.show = false;
                    // }
                    // handlerPolygon.polygon.show = false;
                    // handlerPolygon.polyline.show = false;
                    that.closesDigTheEarth();
                };

                if (!scene.pickPositionSupported) {

 widgets/spatialAnalysis/Widget.html

@@ -5,6 +5,38 @@
            ဆ
        </i>
    </div>
    <div id="SelectLayerTool">
        选择操作图层：
        <button class="layui-btn layui-btn-primary SelectLayerTool">
            默认：天地图影像
            <i class="layui-icon layui-icon-down layui-font-12"></i>
        </button>
        <div id="SelectLayerToolItem">
            <ul class="layers-titles"  id="SelectLayerToolItemTitle">
                <li itemid='默认：天地图影像s' itemtitle='默认：天地图影像'>
                    <div>
                        <span title='默认：天地图影像'>
                            默认：天地图影像
                        </span>
                    </div>
                </li>
                <!-- <li itemid='obj.id' itemtitle='obj.title'>
                    <div>
                        <span title='obj.title'>
                            obj.title
                        </span>
                    </div>
                </li>
                <li itemid='obj.id' itemtitle='obj.title'>
                    <div>
                        <span title='obj.title'>
                            obj.title
                        </span>
                    </div>
                </li> -->
            </ul>
        </div>
    </div>
    <div class="main" id="spatialAnalysis-mains">
        <ul>
            没有工具

 widgets/spatialAnalysis/Widget.js

@@ -33,50 +33,7 @@

                topic.subscribe("closeOnceUse", lang.hitch(this, this.closeOnceUse));

                // function createTooltip(frameDiv) {//抄录createTooltip函数

                //     var tooltip = function (frameDiv) {

                //         var div = document.createElement('DIV');
                //         div.className = "twipsy right";

                //         var arrow = document.createElement('DIV');
                //         arrow.className = "twipsy-arrow";
                //         div.appendChild(arrow);

                //         var title = document.createElement('DIV');
                //         title.className = "twipsy-inner";
                //         div.appendChild(title);

                //         this._div = div;
                //         this._title = title;
                //         this.message = '';

                //         // add to frame div and display coordinates
                //         frameDiv.appendChild(div);
                //         var that = this;
                //         div.onmousemove = function (evt) {
                //             that.showAt({ x: evt.clientX, y: evt.clientY }, that.message);
                //         };
                //     };

                //     tooltip.prototype.setVisible = function (visible) {
                //         this._div.style.display = visible ? 'block' : 'none';
                //     };

                //     tooltip.prototype.showAt = function (position, message) {
                //         if (position && message) {
                //             this.setVisible(true);
                //             this._title.innerHTML = message;
                //             this._div.style.left = position.x + 10 + "px";
                //             this._div.style.top = (position.y - this._div.clientHeight / 2) + "px";
                //             this.message = message;
                //         }
                //     };

                //     return new tooltip(frameDiv);
                // }
                // window.MYcreateTooltip = createTooltip;//全局使用

                var domHtmls = [//默认
                    {
@@ -181,7 +138,7 @@
                        var promise = false;
                        $('.modesssssllll').click(() => {
                            var URL_CONFIG = {
                                SCENE_CBD: 'http://www.supermapol.com/realspace/services/3D-CBDCache20200416/rest/realspace',
                                SCENE_CBD: 'http://www.supermapol.com/realspace/services/3D-niaochao/rest/realspace',
                            }
                            promise = this.map.scene.open(URL_CONFIG.SCENE_CBD);
                        })
@@ -278,6 +235,181 @@
                    topic.publish('beginSpatialQuery', 'beginSpatialQuery');
                })

                // var datas = [//layui舍弃
                //     {
                //         title: '默认：天地图影像'
                //         // , child: [
                //         //     {
                //         //         title: 'menu item 3-2-1'
                //         //         , id: 105
                //         //     }
                //         // ]
                //     }
                // ]
                // // that.beginRool(datas);
                // that.datas = datas;
                // // 注册添加工具事件--规定操作图层
                // topic.subscribe("addSelectLayerTool", lang.hitch(this, this.addSelectLayerTool));
                // // 注册删除工具事件--规定操作图层
                // topic.subscribe("removeSelectLayerTool", lang.hitch(this, this.removeSelectLayerTool));

                $('.SelectLayerTool').click(() => {
                    $('#SelectLayerToolItem').toggle();
                })
                //参照Layemanagement
                topic.subscribe("appendItemS", lang.hitch(this, this.appendItemS));
                topic.subscribe("removeItemS", lang.hitch(this, this.removeItemS));

                topic.subscribe("appendTiltS", lang.hitch(this, this.appendTiltS));
                topic.subscribe("removeTiltS", lang.hitch(this, this.removeTiltS));
                this.liClick('默认：天地图影像','默认：天地图影像');

            },
            liClick: function (itemid,name) {
                var liList = $(`[itemid='${itemid}s']`);
                // console.log(liList);
                liList.click(() => {
                    // console.log(itemid)
                    var dom = $('.SelectLayerTool');
                    layer.tips('选择了：' + name, dom, { tips: [1, '#5FB878'] });
                    dom.empty();
                    var str = `${name} <i class="layui-icon layui-icon-down layui-font-12"></i>`
                    dom.append(str);
                    dom = $('#SelectLayerToolItem').hide();
                })
            },
            fakeName: 'Layermanagement',
            appendItemS: function (item, obj, layer) {
                // console.log('a1')
                var that = this;
                if (item == this.fakeName) {

                    // $("#SelectLayerToolItemTitle .no-data").stop().hide();
                    var flag = true;
                    var liList = $("#SelectLayerToolItemTitle li");
                    // console.log(liList)
                    // console.log($('#SelectLayerToolItemTitle'))
                    for (var i = 0; i < liList.length; i++) {
                        if ($(liList[i]).attr('itemid') && $(liList[i]).attr('itemid') == obj.id) {
                            flag = false
                        }
                    }

                    if (flag == true) {
                        var liItem = $("<li itemid='" + obj.id + "s' itemtitle='" + obj.title + "'> <div>" +
                            "<span title='" + obj.title + "'>" +
                            obj.title +
                            "</span>" +
                            "</div> </li>");

                        that[obj.id] = layer;

                        $("#SelectLayerToolItemTitle").append(liItem);
                    }
                    that.liClick(obj.id,obj.title);
                }
            },
            removeItemS: function (item, obj) {
                // console.log('r1')
                if (item == this.fakeName) {
                    var liList = $("#SelectLayerToolItemTitle li");
                    for (var i = 0; i < liList.length; i++) {
                        if ($(liList[i]).attr('itemid') && $(liList[i]).attr('itemid') == obj.id) {
                            $(liList[i]).remove();
                        }
                    }

                    if ($("#SelectLayerToolItemTitle li").length == 1 && $("#SelectLayerToolItemTitle li").length == 0) {
                        $("#SelectLayerToolItemTitle .no-data").stop().show();
                        $(".jimu-widget-spatialAnalysis .tree-layer-opcity").stop().hide();
                    }

                }

                // this.liClick();
            },
            appendTiltS: function (item, obj, layer) {
                // console.log('a2')
                var that = this;
                if (item == this.fakeName) {

                    // $("#SelectLayerToolItemTitle .no-data").stop().hide();

                    var flag = true;

                    var liList = $("#SelectLayerToolItemTitle li");

                    for (var i = 0; i < liList.length; i++) {

                        if ($(liList[i]).attr('itemid') && $(liList[i]).attr('itemid') == obj.id) {

                            flag = false
                        }
                    }
                    if (flag == true) {
                        var liItem = $("<li itemid='" + obj.id + "s' itemtitle='" + obj.title + "'> <div>" +
                            "<span title='" + obj.title + "'>" +
                            obj.title +
                            "</span>" +
                            "</div> </li>");

                        $("#SelectLayerToolItemTitle").append(liItem);
                    }
                    that.liClick(obj.id,obj.title);
                }
            },
            removeTiltS: function (item, obj) {
                // console.log('r2')
                if (item == this.fakeName) {
                    var liList = $("#SelectLayerToolItemTitle li");
                    for (var i = 0; i < liList.length; i++) {
                        if ($(liList[i]).attr('itemid') && $(liList[i]).attr('itemid') == obj.id) {
                            $(liList[i]).remove();
                        }
                    }

                    if ($("#SelectLayerToolItemTitle li").length == 1 && $("#SelectLayerToolItemTitle li").length == 0) {
                        // $("#SelectLayerToolItemTitle .no-data").stop().show();
                        // $(".jimu-widget-spatialAnalysis .tree-layer-opcity").stop().hide();
                    }
                }
            },

            // datas: [],//layui舍弃
            // addSelectLayerTool: function (num, val) {
            //     console.log(num, val);
            //     var that = this
            //         , d = that.datas;
            //     //三维数据处理 添加全部 9 添加时删除 10 删除全部 6 //添加单个 9 添加时删除 10 删除全部 6 
            //     // var sanwei = {};
            //     // if (num == 9) {
            //     //     sanwei.title = '三维倾斜数据'
            //     // }
            //     // d.push({
            //     //     title: val.title
            //     // })
            //     // that.beginRool(that.datas);
            // },
            // removeSelectLayerTool: function (num, val) {
            //     console.log(num, val)
            // },
            beginRool: function (data) {
                //选择图层Layui
                layui.use(['dropdown', 'util', 'layer', 'table'], function () {
                    var dropdown = layui.dropdown
                        , layer = layui.layer;
                    dropdown.render({
                        elem: '.SelectLayerTool'
                        , data: data
                        , click: function (obj) {
                            layer.tips('选择了：' + obj.title, this.elem, { tips: [1, '#5FB878'] });
                            var dom = $('.SelectLayerTool');
                            dom.empty();
                            var str = `${obj.title} <i class="layui-icon layui-icon-down layui-font-12"></i>`
                            dom.append(str);
                        }
                    });
                });
            },
            closeToolBox: function (item) {
                if (item != this.name) {

 widgets/spatialAnalysis/css/style.css

@@ -50,7 +50,7 @@
  overflow: auto;
}

.jimu-widget-spatialAnalysis li {
.jimu-widget-spatialAnalysis #spatialAnalysis-mains li {
  position: relative;
  left: 6px;
  top: 5px;
@@ -73,7 +73,7 @@
  flex-direction: column;
}

.jimu-widget-spatialAnalysis li:hover {
.jimu-widget-spatialAnalysis #spatialAnalysis-mains li:hover {
  background-color: #ffffff;
  box-shadow: 3px 3px 20px -4px #0b8af1;
}
@@ -93,4 +93,68 @@

.jimu-widget-spatialAnalysis .imgs img {
  width: 40px;
}

.jimu-widget-spatialAnalysis #SelectLayerTool {
  width: 100%;
  height: 46px;
  /* border:1px solid springgreen; */
  display: flex;
  align-items: center;
  flex-direction: row;
  padding-left: 8px;
}

.jimu-widget-spatialAnalysis #SelectLayerTool .SelectLayerTool {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 3px !important;
}

.jimu-widget-spatialAnalysis #SelectLayerTool #SelectLayerToolItem {
  position: absolute;
  top: 85px;
  /* right: 60px; */
  width: 300px;
  z-index: 15;
  min-height: 40px;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 0 8px rgb(35, 160, 243);
  max-height: 360px;
  overflow-y: auto;
  display: none;
}

/* .jimu-widget-spatialAnalysis #SelectLayerToolItem */

.jimu-widget-spatialAnalysis #SelectLayerToolItem #SelectLayerToolItemTitle li {
  width: 285px;
  height: 30px;
  display: flex;
  flex-direction: row;
  align-items: center;
  border-bottom: 1px solid rgb(35, 160, 243);
  /* border-top: 1px solid rgba(35, 160, 243, .1); */
  margin-bottom: 3px;
  cursor: pointer;
  margin-left: 5px;
}

.jimu-widget-spatialAnalysis #SelectLayerToolItem #SelectLayerToolItemTitle li span {
  display: block;
  width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jimu-widget-spatialAnalysis #SelectLayerToolItem #SelectLayerToolItemTitle li:nth-child(1) {
  margin-top: 5px !important;
}

.jimu-widget-spatialAnalysis #SelectLayerToolItem #SelectLayerToolItemTitle li:last-child {
  border-bottom: 1px solid transparent;
}

 widgets/visibleArea/Widget.js

@@ -318,7 +318,7 @@
                    viewer.entities.removeAll();
                    viewshed3D.distance = 0.1;
                    scene.viewFlag = true;
                    // pointHandler.clear();
                    pointHandler.clear();
                })

                $('.jimu-widget-visibleArea').find(".closes").click(function () {