一、由上到下
1 2 3 4 5 6 7 8 9 10 | // 着色器代码 "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\ material.alpha = colorImage.a * color.a;\n\ material.diffuse = (colorImage.rgb+color.rgb)/2.0;\n\ return material;\n\ }" |
二、由下到上
1 2 3 4 5 6 7 8 9 10 | // 着色器代码 "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\ material.alpha = colorImage.a * color.a;\n\ material.diffuse = (colorImage.rgb+color.rgb)/2.0;\n\ return material;\n\ }" |
三、顺时针
1 2 3 4 5 6 7 8 9 | "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.s + time)), st.t));\n\ material.alpha = colorImage.a * color.a;\n\ material.diffuse = (colorImage.rgb+color.rgb)/2.0;\n\ return material;\n\ }"; |
四、逆时针
1 2 3 4 5 6 7 8 9 | "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.s - time), st.t));\n\ material.alpha = colorImage.a * color.a;\n\ material.diffuse = (colorImage.rgb+color.rgb)/2.0;\n\ return material;\n\ }" |
Cesium渐变纹理
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 | function PolylineTrailLinkMaterialProperty(color, duration) { this._definitionChanged = new Cesium.Event(); this._color = undefined; this._colorSubscription = undefined; this.color = color; this.duration = duration; this._time = (new Date()).getTime(); } Object.defineProperties(PolylineTrailLinkMaterialProperty.prototype, { isConstant: { get: function () { return false; } }, definitionChanged: { get: function () { return this._definitionChanged; } }, color: Cesium.createPropertyDescriptor('color') }); PolylineTrailLinkMaterialProperty.prototype.getType = function (time) { return 'PolylineTrailLink'; } PolylineTrailLinkMaterialProperty.prototype.getValue = function (time, result) { if (!Cesium.defined(result)) { result = {}; } result.color = Cesium.Property.getValueOrClonedDefault(this._color, time, Cesium.Color.WHITE, result.color); result.image = Cesium.Material.PolylineTrailLinkImage; result.time = (((new Date()).getTime() - this._time) % this.duration) / this.duration; return result; } PolylineTrailLinkMaterialProperty.prototype.equals = function (other) { return this === other || (other instanceof PolylineTrailLinkMaterialProperty && Property.equals(this._color, other._color)) }; Cesium.PolylineTrailLinkMaterialProperty = PolylineTrailLinkMaterialProperty; Cesium.Material.PolylineTrailLinkType = 'PolylineTrailLink'; Cesium.Material.PolylineTrailLinkImage = "../img/colors1.png";//图片 Cesium.Material.PolylineTrailLinkSource = 【上述代码】; Cesium.Material._materialCache.addMaterial(Cesium.Material.PolylineTrailLinkType, { fabric: { type: Cesium.Material.PolylineTrailLinkType, uniforms: { color: new Cesium.Color(1.0, 0.0, 0.0, 0.5), image: Cesium.Material.PolylineTrailLinkImage, time: 0 }, source: Cesium.Material.PolylineTrailLinkSource }, translucent: function (material) { return true; } }) let three = viewer.entities.add({ name: 'yscNoNeedEntity', wall: { positions: Cesium.Cartesian3.fromDegreesArrayHeights([ 118.286419,31.864436,20000.0, 119.386419,31.864436,20000.0, 119.386419,32.864436,20000.0, 118.286419,32.864436,20000.0, 118.286419,31.864436,20000.0, ]), material: new Cesium.PolylineTrailLinkMaterialProperty(Cesium.Color.BLUE,3000), } }) viewer.flyTo(three) |