<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<title>流动纹理(喷水测试)</title>
<script src="../Cesium/Cesium.js"></script>
<link href="../Cesium/Widgets/widgets.css" rel="stylesheet" />
</head>
<body>
<div id="cesiumContainer" ></div>
<script>
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJlZWVhNjZkZS0yZDgzLTRhZGEtOGJkYS1iMWUxNmM3NzNmNmUiLCJpZCI6NjM1MzEsImlhdCI6MTYyODIyNzYyMn0.Swb3G8ZboOXzXXiMLjEXIErFjXXZmbZrFIKXCxtIxnQ';
var viewer = new Cesium.Viewer('cesiumContainer');
//设置初始位置
viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(117.08259, 36.87161, 200)
});
//核心代码---------------------------------------------------------------------------------------------------------------------------
/*
流纹纹理线
color 颜色
duration 持续时间 毫秒
*/
//-----------------流动纹理材质(开始)--------------------------------------------------------------------------------------------------------------
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<
cesium 流动纹理(喷水测试)
最新推荐文章于 2024-08-09 15:26:12 发布
本文分享了如何使用Cesium创建流动纹理的效果,以实现喷水的动态视觉展示。通过代码分析和实例图片(img.png),揭示了Cesium在三维场景中处理动态纹理的技巧。
摘要由CSDN通过智能技术生成