当前位置: 首页> 健康> 母婴 > cesium添加流动线

cesium添加流动线

时间:2025/7/11 23:10:24来源:https://blog.csdn.net/iouytrep/article/details/140772980 浏览次数:0次

1:新建Spriteline1MaterialProperty.js文件

import * as Cesium from 'cesium';export function Spriteline1MaterialProperty(duration, image) {this._definitionChanged = new Cesium.Event();this.duration = duration;this.image = image;this._time = performance.now();
}
Object.defineProperties(Spriteline1MaterialProperty.prototype, {isConstant: {get: function () {return false;},},definitionChanged: {get: function () {return this._definitionChanged;},},color: Cesium.createPropertyDescriptor('color'),duration: Cesium.createPropertyDescriptor('duration'),
});
Spriteline1MaterialProperty.prototype.getType = function (time) {return 'Spriteline1';
};
Spriteline1MaterialProperty.prototype.getValue = function (time, result) {if (!Cesium.defined(result)) {result = {};}result.image = this.image;result.time = ((performance.now() - this._time) % this.duration) / this.duration;return result;
};
Spriteline1MaterialProperty.prototype.equals = function (e) {return this === e || (e instanceof Spriteline1MaterialProperty && this.duration === e.duration);
};
Cesium.Spriteline1MaterialProperty = Spriteline1MaterialProperty;
Cesium.Material.Spriteline1Type = 'Spriteline1';
Cesium.Material.Spriteline1Source = `
czm_material czm_getMaterial(czm_materialInput materialInput)
{
czm_material material = czm_getDefaultMaterial(materialInput);
vec2 st = materialInput.st;
vec4 colorImage = texture(image, vec2(fract(st.s - time), st.t));
material.alpha = colorImage.a;
material.diffuse = colorImage.rgb * 1.5 ;
return material;
}
`;
// st :二维纹理坐标
// czm_material:保存可用于照明的材质信息
Cesium.Material._materialCache.addMaterial(Cesium.Material.Spriteline1Type, {fabric: {type: Cesium.Material.Spriteline1Type,uniforms: {color: new Cesium.Color(1, 0, 0, 0.5),image: '',transparent: true,time: 20,},source: Cesium.Material.Spriteline1Source,},translucent: function (material) {return true;},
});

2:vue组件引用

 import './js/Spriteline1MaterialProperty';

 var dataSource = new Cesium.CzmlDataSource();window.viewer.dataSources.add(dataSource);   dataSource.load('SampleData/Scenario4.czml').then(function (res) {res.entities.values.forEach((item) => {if (item.id == 'Satellite/Geoeye1-to-Satellite/ISS') {item.polyline.material = new Cesium.Spriteline1MaterialProperty(10000,'/gltfModel/images/line-tarans.png',);}});});

关键字:cesium添加流动线

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

责任编辑: