roller.js 1.78 KB
export default 
    class Roller {
        constructor(obj) {
            this.imageryLayers = obj.imageryLayers;
            this.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({
                url: obj.url,
                layer: "tdtBasicLayer",
                style: "default",
                format: "image/jpeg",
                tileMatrixSetID: "GoogleMapsCompatible",
                show: false
            })).splitDirection = Cesium.ImagerySplitDirection.LEFT;
        }
        screen(opt) {
            var slider = opt.slider, handler = new Cesium.ScreenSpaceEventHandler(slider), moveActive = false;
            function move(movement) {
                if (!moveActive) return;
                var relativeOffset = movement.endPosition.x;
                var splitPosition =
                    (slider.offsetLeft + relativeOffset) /
                    slider.parentElement.offsetWidth;
                slider.style.left = 100.0 * splitPosition + "%";
                opt.viewer.scene.imagerySplitPosition = splitPosition;
            }

            handler.setInputAction(function () {
                moveActive = true;
            }, Cesium.ScreenSpaceEventType.LEFT_DOWN);
            handler.setInputAction(function () {
                moveActive = true;
            }, Cesium.ScreenSpaceEventType.PINCH_START);

            handler.setInputAction(move, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
            handler.setInputAction(move, Cesium.ScreenSpaceEventType.PINCH_MOVE);

            handler.setInputAction(function () {
                moveActive = false;
            }, Cesium.ScreenSpaceEventType.LEFT_UP);
            handler.setInputAction(function () {
                moveActive = false;
            }, Cesium.ScreenSpaceEventType.PINCH_END);
        }
    }