标绘，分屏，对比BUG修复

nnnjjj123

2020-11-17 56239828469da7d8cef92cc6bf9d99c858168bb5

 widgets/Screen/Widget.js

@@ -17,7 +17,7 @@
            baseClass: 'jimu-widget-Screen',
            name: 'Screen',
            flag: false,
            viewers: '',
            viewers1: '',
            viewerss: '',
            startup: function () {
                var that = this;
@@ -25,7 +25,138 @@
                $('.rollinng-table-hezi-xxs').click(function () {
                    $('.jimu-widget-Screen').hide();
                });
                that.viewers = new Cesium.Viewer('sliders2', {

                // 加载左边图层
                $('#hezi-selectLefts').on('change', function () {
                    console.log(that.viewers1, 11111111)
                    $('#sliders2').html("");
                    that.viewers1 = '';
                    if ($(this).val() == 2) {
                        that.viewers1 = new Cesium.Viewer('sliders2', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图矢量",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/vec_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "vec",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewers1._cesiumWidget._creditContainer.style.display = "none";
                        that.initHandler()
                    }
                    else if ($(this).val() == 1) {
                        that.viewers1 = new Cesium.Viewer('sliders2', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图影像",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/img_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "img",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewers1._cesiumWidget._creditContainer.style.display = "none";
                        that.initHandler()
                    }
                });


                // 加载右边图层
                $('#hezi-selectRights').on('change', function () {
                    $('#sliders1').html("");
                    that.viewerss = '';
                    if ($(this).val() == 1) {
                        that.viewerss = new Cesium.Viewer('sliders1', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图矢量",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/vec_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "vec",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewerss._cesiumWidget._creditContainer.style.display = "none";
                        that.initHandler()
                    }
                    else if ($(this).val() == 2) {
                        that.viewerss = new Cesium.Viewer('sliders1', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图影像",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/img_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "img",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewerss._cesiumWidget._creditContainer.style.display = "none";
                        that.initHandler()
                    }
                });





            },

            onOpen: function () {
                var that = this;
                that.viewers1 = new Cesium.Viewer('sliders2', {
                    baseLayerPicker: false,
                    animation: false,//是否创建动画小器件，左下角仪表    
                    baseLayerPicker: false,//是否显示图层选择器    
@@ -37,11 +168,18 @@
                    selectionIndicator: false,//是否显示选取指示器组件    
                    timeline: false,//是否显示时间轴    
                    navigationHelpButton: false,//是否显示右上角的帮助按钮 
                    imageryProvider: new Cesium.ArcGisMapServerImageryProvider({
                        url: 'http://map.geoq.cn/arcgis/rest/services/ChinaOnlineStreetWarm/MapServer'
                    imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                        "label": "天地图矢量",
                        "type": "wmts",
                        "url": "http://t0.tianditu.gov.cn/vec_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                        "layer": "vec",
                        "style": "default",
                        "format": "tiles",
                        "tileMatrixSetID": "w",
                        "maximumLevel": 17
                    })
                });
                that.viewers._cesiumWidget._creditContainer.style.display = "none";
                that.viewers1._cesiumWidget._creditContainer.style.display = "none";

                that.viewerss = new Cesium.Viewer('sliders1', {
                    baseLayerPicker: false,
@@ -56,10 +194,10 @@
                    timeline: false,//是否显示时间轴    
                    navigationHelpButton: false,//是否显示右上角的帮助按钮 
                    imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                        "label": "天地图影像",
                        "label": "天地图矢量",
                        "type": "wmts",
                        "url": "http://t0.tianditu.gov.cn/img_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                        "layer": "img",
                        "url": "http://t0.tianditu.gov.cn/vec_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                        "layer": "vec",
                        "style": "default",
                        "format": "tiles",
                        "tileMatrixSetID": "w",
@@ -67,201 +205,76 @@
                    })
                });
                that.viewerss._cesiumWidget._creditContainer.style.display = "none";
                initHandler()
                // 加载左边图层
                $('#hezi-selectLefts').on('change', function () {
                    $('#sliders2').html("");
                    that.viewers = '';
                    if ($(this).val() == 2) {
                        that.viewers = new Cesium.Viewer('sliders2', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图矢量",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/vec_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "vec",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewers._cesiumWidget._creditContainer.style.display = "none";
                        initHandler()
                    }
                    else if ($(this).val() == 1) {
                        that.viewers = new Cesium.Viewer('sliders2', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图影像",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/img_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "img",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewers._cesiumWidget._creditContainer.style.display = "none";
                        initHandler()
                    }
                });


                // 加载右边图层
                $('#hezi-selectRights').on('change', function () {
                    $('#sliders1').html("");
                    that.viewerss = '';
                    if ($(this).val() == 2) {
                        that.viewerss = new Cesium.Viewer('sliders1', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图矢量",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/vec_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "vec",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewerss._cesiumWidget._creditContainer.style.display = "none";
                        initHandler()
                    }
                    else if ($(this).val() == 1) {
                        that.viewerss = new Cesium.Viewer('sliders1', {
                            baseLayerPicker: false,
                            animation: false,//是否创建动画小器件，左下角仪表    
                            baseLayerPicker: false,//是否显示图层选择器    
                            fullscreenButton: false,//是否显示全屏按钮    
                            geocoder: false,//是否显示geocoder小器件，右上角查询按钮    
                            homeButton: false,//是否显示Home按钮    
                            infoBox: false,//是否显示信息框    
                            sceneModePicker: false,//是否显示3D/2D选择器    
                            selectionIndicator: false,//是否显示选取指示器组件    
                            timeline: false,//是否显示时间轴    
                            navigationHelpButton: false,//是否显示右上角的帮助按钮 
                            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                                "label": "天地图影像",
                                "type": "wmts",
                                "url": "http://t0.tianditu.gov.cn/img_w/wmts?tk=e9533f5acb2ac470b07f406a4d24b4f0",
                                "layer": "img",
                                "style": "default",
                                "format": "tiles",
                                "tileMatrixSetID": "w",
                                "maximumLevel": 17
                            })
                        });
                        that.viewerss._cesiumWidget._creditContainer.style.display = "none";
                        initHandler()
                    }
                });


                //鼠标监听事件
                function initHandler() {
                    var _self = this;
                    if (_self.handler && _self.handler.getInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE)) {
                        return;
                    }
                    _self.handler = new Cesium.ScreenSpaceEventHandler(that.viewers.scene.canvas);
                    _self.handler1 = new Cesium.ScreenSpaceEventHandler(that.viewerss.scene.canvas);
                    _self.handler.setInputAction(function (movement) {
                        var _camerca = that.viewers.camera;
                        that.viewerss.camera.setView({
                            destination: _camerca.position,
                            orientation: {
                                direction: _camerca._direction,
                                up: _camerca.up,
                                heading: _camerca.heading,
                                pitch: _camerca.pitch,
                                roll: _camerca.roll
                            }
                        });
                    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

                    _self.handler.setInputAction(function (movement) {
                        var _camerca = that.viewers.camera;
                        that.viewerss.camera.setView({
                            destination: _camerca.position,
                            orientation: {
                                direction: _camerca._direction,
                                up: _camerca.up,
                                heading: _camerca.heading,
                                pitch: _camerca.pitch,
                                roll: _camerca.roll
                            }
                        });
                    }, Cesium.ScreenSpaceEventType.WHEEL);


                    _self.handler1.setInputAction(function (movement) {
                        var _camerca = that.viewerss.camera;
                        that.viewers.camera.setView({
                            destination: _camerca.position,
                            orientation: {
                                direction: _camerca._direction,
                                up: _camerca.up,
                                heading: _camerca.heading,
                                pitch: _camerca.pitch,
                                roll: _camerca.roll
                            }
                        });
                    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

                    _self.handler1.setInputAction(function (movement) {
                        var _camerca = that.viewerss.camera;
                        that.viewers.camera.setView({
                            destination: _camerca.position,
                            orientation: {
                                direction: _camerca._direction,
                                up: _camerca.up,
                                heading: _camerca.heading,
                                pitch: _camerca.pitch,
                                roll: _camerca.roll
                            }
                        });
                    }, Cesium.ScreenSpaceEventType.WHEEL);
                }


                that.initHandler()
            },

            onOpen: function () {
            },
            //鼠标监听事件
            initHandler: function () {
                var that = this;
                var _self = this;
                // if (_self.handler && _self.handler.getInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE) || _self.handler1 && _self.handler1.getInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE)) {
                //     return;
                // }
                _self.handler = new Cesium.ScreenSpaceEventHandler(that.viewers1.scene.canvas);
                _self.handler1 = new Cesium.ScreenSpaceEventHandler(that.viewerss.scene.canvas);
                _self.handler.setInputAction(function (movement) {
                    console.log(movement, 2);
                    var _camerca = that.viewers1.camera;
                    that.viewerss.camera.setView({
                        destination: _camerca.position,
                        orientation: {
                            direction: _camerca._direction,
                            up: _camerca.up,
                            heading: _camerca.heading,
                            pitch: _camerca.pitch,
                            roll: _camerca.roll
                        }
                    });
                }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

                _self.handler.setInputAction(function (movement) {
                    var _camerca = that.viewers1.camera;
                    that.viewerss.camera.setView({
                        destination: _camerca.position,
                        orientation: {
                            direction: _camerca._direction,
                            up: _camerca.up,
                            heading: _camerca.heading,
                            pitch: _camerca.pitch,
                            roll: _camerca.roll
                        }
                    });
                }, Cesium.ScreenSpaceEventType.WHEEL);


                _self.handler1.setInputAction(function (movement) {
                    var _camercas = that.viewerss.camera;
                    that.viewers1.camera.setView({
                        destination: _camercas.position,
                        orientation: {
                            direction: _camercas._direction,
                            up: _camercas.up,
                            heading: _camercas.heading,
                            pitch: _camercas.pitch,
                            roll: _camercas.roll
                        }
                    });
                }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

                _self.handler1.setInputAction(function (movement) {
                    var _camercas = that.viewerss.camera;
                    that.viewers1.camera.setView({
                        destination: _camercas.position,
                        orientation: {
                            direction: _camercas._direction,
                            up: _camercas.up,
                            heading: _camercas.heading,
                            pitch: _camercas.pitch,
                            roll: _camercas.roll
                        }
                    });
                }, Cesium.ScreenSpaceEventType.WHEEL);
            },

            onClose: function () {
                //面板关闭的时候触发 （when this panel is closed trigger）