北京经济技术开发区经开区虚拟城市项目-【前端】--政府服务中心-1号屏Web
Surpriseplus
2023-10-08 b0623031f7839e3f5b061f712c6ead91f57db5cf
地块展示效果优化
已添加2个文件
已修改2个文件
147 ■■■■ 文件已修改
index.html 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/js/rpc.js 64 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
static/SmartEarthSDK/Workers/image/1.png 补丁 | 查看 | 原始文档 | blame | 历史
static/polyline.js 82 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
index.html
@@ -15,6 +15,7 @@
  <script src="./static/SmartEarthSDK/Workers/jquery-2.0.3.js"></script>
  <script src="./static/SmartEarthSDK/SmartEarth.min.js"></script>
  <script src="./static/SmartEarthSDK/Workers/layui/layui.all.js"></script>
  <script src="./static/polyline.js"></script>
</head>
<body oncontextmenu="return false;" ondragstart="return false;" onselectstart="return false;">
src/assets/js/rpc.js
@@ -128,7 +128,7 @@
                    lon: val.location.x,
                    lat: val.location.y,
                };
                objArr.push(itemObj);
                that.objArr.push(itemObj);
            });
            if (index == length) {
                if (that.objArr.length <= 0) {
@@ -177,10 +177,12 @@
    },
    // æ˜¾ç¤ºåœ°å—范围
    getLandmass(res) {
        let that = this;
        if (res.tpye == "园区") {
        } else if (res.tpye == "地块") {
        let that = this;
        if (res.type == "园区") {
        } else if (res.type == "地块") {
            getDiKuanFanWei(res.lon, res.lat).then(response => {
                let center = { lon: 0, lat: 0 };
                let polygon = that.read(response.geometry);
@@ -189,25 +191,29 @@
                    let points = polygon[0].split(",");
                    for (let i = 0; i < points.length; i++) {
                        let point = points[i].replace(/^\s+|\s+$/g, "").split(" ");
                        center.lon += parseFloat(point[0]) / points.length;
                        center.lat += parseFloat(point[1]) / points.length;
                        geometry.push({
                            x: parseFloat(point[0]),
                            y: parseFloat(point[1]),
                            z: 0
                        });
                        // center.lon += parseFloat(point[0]) / points.length;
                        // center.lat += parseFloat(point[1]) / points.length;
                        geometry.push(parseFloat(point[0]), parseFloat(point[1]))
                    }
                    if (that.lacationLine) {
                        sgworld.Creator.DeleteObject(that.lacationLine);
                        that.lacationLine = null;
                    }
                    that.lacationLine = sgworld.Creator.createPolyline(
                        geometry,
                        "#ff0000",
                        1,
                        0,
                        "线"
                    );
                    that.setLacationLineClear()
                    var position = Cesium.Cartesian3.fromDegreesArray(geometry)
                    that.lacationLine = Viewer.entities.add({
                        name: "立体墙效果",
                        wall: {
                            positions: position,
                            material: new Cesium.DynamicWallMaterialProperty({
                                color: Cesium.Color.RED,
                                duration: 4000
                            }),
                            // è®¾ç½®é«˜åº¦
                            maximumHeights: Array(position.length).fill(80),
                            minimumHeights: Array(position.length).fill(10),
                        }
                    })
                }
            });
        }
@@ -760,10 +766,8 @@
            this.instance && this.instance.$destroy();
            this.instance = null;
        }
        if (this.lacationLine) {
            sgworld.Creator.DeleteObject(this.lacationLine);
            this.lacationLine = null;
        }
        //地块
        this.setLacationLineClear()
        // è½¨è¿¹çº¿
        this.setClosePathLine();
        // æ¼«æ¸¸
@@ -772,6 +776,14 @@
        this.setClearPointFly();
        vueEvents.$emit("queryLayer", false);
    },
    setLacationLineClear() {
        if (this.lacationLine) {
            Viewer.entities.remove(this.lacationLine)
            this.lacationLine = null;
        }
    },
    setClearPointFly() {
        if (this.pointerFly) {
            this.pointerFly && this.pointerFly.end();
static/SmartEarthSDK/Workers/image/1.png
static/polyline.js
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,82 @@
//动态墙材质
function DynamicWallMaterialProperty(options) {
    // é»˜è®¤å‚数设置
    this._definitionChanged = new Cesium.Event();
    this._color = undefined;
    this._colorSubscription = undefined;
    this.color = options.color;
    this.duration = options.duration;
    this.trailImage = options.trailImage;
    this._time = (new Date()).getTime();
}
Object.defineProperties(DynamicWallMaterialProperty.prototype, {
    isConstant: {
        get: function () {
            return false;
        }
    },
    definitionChanged: {
        get: function () {
            return this._definitionChanged;
        }
    },
    color: Cesium.createPropertyDescriptor('color')
});
DynamicWallMaterialProperty.prototype.getType = function (time) {
    return 'DynamicWall';
};
DynamicWallMaterialProperty.prototype.getValue = function (time, result) {
    if (!Cesium.defined(result)) {
        result = {};
    }
    result.color = Cesium.Property.getValueOrClonedDefault(this._color, time, Cesium.Color.WHITE, result.color);
    if (this.trailImage) {
        result.image = this.trailImage;
    } else {
        result.image = Cesium.Material.DynamicWallImage
    }
    if (this.duration) {
        result.time = (((new Date()).getTime() - this._time) % this.duration) / this.duration;
    }
    Viewer.scene.requestRender();
    return result;
};
DynamicWallMaterialProperty.prototype.equals = function (other) {
    return this === other ||
        (other instanceof DynamicWallMaterialProperty &&
            Cesium.Property.equals(this._color, other._color))
};
Cesium.DynamicWallMaterialProperty = DynamicWallMaterialProperty;
Cesium.Material.DynamicWallType = 'DynamicWall';
Cesium.Material.DynamicWallImage = "/static/SmartEarthSDK/Workers/image/1.png";
Cesium.Material.DynamicWallSource = "czm_material czm_getMaterial(czm_materialInput materialInput)\n\
                                            {\n\
                                            czm_material material = czm_getDefaultMaterial(materialInput);\n\
                                            vec2 st = materialInput.st;\n\
                                            vec4 colorImage = texture2D(image, vec2(fract(st.t - time), st.t));\n\
                                            vec4 fragColor;\n\
                                            fragColor.rgb = color.rgb / 1.0;\n\
                                            fragColor = czm_gammaCorrect(fragColor);\n\
                                            material.alpha = colorImage.a * color.a;\n\
                                            material.diffuse = color.rgb;\n\
                                            material.emission = fragColor.rgb;\n\
                                            return material;\n\
                                            }";
Cesium.Material._materialCache.addMaterial(Cesium.Material.DynamicWallType, {
    fabric: {
        type: Cesium.Material.DynamicWallType,
        uniforms: {
            color: new Cesium.Color(1.0, 1.0, 1.0, 1),
            image: Cesium.Material.DynamicWallImage,
            time: 0
        },
        source: Cesium.Material.DynamicWallSource
    },
    translucent: function (material) {
        return true;
    }
});