JT-CIM-SDK/packages/Widgets/WallObject.js

/* 引入Cesium */
// import * as Cesium from 'Cesium';

import {
	setSessionid
} from "./common/common.js";

/**
 *流动纹理
 */
import DynamicWallMaterialProperty from "./WallObject/DynamicWallMaterialProperty.js";
import WallDiffuseMaterialProperty from "./WallObject/WallDiffuseMaterialProperty.js";
import WallMaterialProperty from "./WallObject/WallMaterialProperty.js";

/**
 * 墙体对象
 */
class WallObject {
	/**
	 * 默认初始化
	 */
	constructor(viewer) {
		if (!viewer) throw new Cesium.DeveloperError('no viewer object!');
		this._viewer = viewer;
	}
}

/**
 * 通用对外公开函数 
 */
Object.assign(WallObject.prototype, /** @lends WallObject.prototype */ {

	/**
	 * @description 根据GeoJson绘制墙体对象
	 * @param {String} geoJsonUrl geoJson文件路径
	 * @param {Object} [options] 线的样式，具有以下属性:
	 * @param {Number} [options.id] 用于移除
	 * @param {Number} [options.clampToGround=true] 是否贴地
	 * @param {Number} [options.minimunHeights=0] 最低高度
	 * @param {Number} [options.maximumHeights=100] 最高高度
	 * @param {Number} [options.imgUrl] 动态墙图片
	 * @param {String} [options.color="#FF0000"] 指定墙的颜色
	 * @param {Number} [options.duration=3000] 持续时间 毫秒，越小越快
	 * @param {Number} [options.count] 重复次数
	 * @param {String} [options.direction='horizontal'] 方向 vertical纵,垂直方向，horizontal横,水平方向
	 * @param {String} [options.order] 方向正负 
	 *                                        vertical 纵:'-'(由下到上) , '+"(由上到下)
	 *                                        horizontal 横:'-'(顺时针) , '+'(逆时针)
	 */
	drawWallByGeoJson: function(geoJsonUrl, options) {
		return new Promise((resolve, reject) => {

			let _self = this;
			let viewer = this._viewer;

			if (!Cesium.defined(geoJsonUrl)) {
				throw new Cesium.DeveloperError("geoJsonUrl is required.");
			}

			options = options || {};
			options.id = options.id || setSessionid();
			options.clampToGround = Cesium.defaultValue(options.clampToGround, true);

			options.minimunHeights = options.minimunHeights !== undefined && typeof options.minimunHeights === 'number' ? options.minimunHeights : 0;
			options.maximumHeights = options.maximumHeights !== undefined && typeof options.maximumHeights === 'number' ? options.maximumHeights : 1000;

			if (options.color) {
				if (options.color instanceof Array) {
					options.color = new Cesium.Color(options.color[0] / 255, options.color[1] / 255, options.color[2] / 255, options.color[3]);
				} else if (typeof(options.color) === 'string') {
					options.color = new Cesium.Color.fromCssColorString(options.color);
				} else {
					options.color = new Cesium.Color.fromCssColorString("#FFFF00");
				}
			}

			options.trailImage = Cesium.defaultValue(options.trailImage, 'jt3dSDK/imgs/wallmaterial/wl.png');
			options.duration = Cesium.defaultValue(options.duration, 3000);
			options.count = Cesium.defaultValue(options.count, 1);
			options.direction = Cesium.defaultValue(options.direction, 'vertical');
			options.order = Cesium.defaultValue(options.order, '-');

			fetch(geoJsonUrl).then(res => {
				return res.json();
			}).then(res => {

				for (var i = 0; i < res.features.length; i++) {
					let coordinates = res.features[i].geometry.coordinates;
					let positions = coordinates.map(point => {
						return Cesium.Cartesian3.fromDegrees(point[0], point[1], point[2] || 0);
					});

					//先创建一个CustomDataSource源，然后把entity存入这里面
					let wall = new Cesium.CustomDataSource(options.id);
					viewer.dataSources.add(wall);

					let entity = new Cesium.Entity({
						name: "立体墙效果",
						wall: {
							positions: positions,
							// 设置高度
							maximumHeights: new Array(positions.length).fill(options.maximumHeights),
							minimunHeights: new Array(positions.length).fill(options.minimunHeights),
							// 扩散墙材质
							// material: new Cesium.WallDiffuseMaterialProperty({
							//     color: new Cesium.Color(1.0, 1.0, 0.0, 1.0)
							// }),
							material: new WallMaterialProperty(viewer, {
								trailImage: options.trailImage,
								color: options.color,
								duration: options.duration,
								param: {
									count: options.count,
									direction: options.direction,
									order: options.order,
								},
							}),

							// material: new Cesium.DynamicWallMaterialProperty({
							// 	trailImage: 'jt3dSDK/imgs/wallmaterial/wl.png',
							// 	color: Cesium.Color.CYAN,
							// 	duration: 1500
							// })
						}
					});

					// 绘制墙体
					wall.entities.add(entity)
				}

				resolve(options.id);
			});

		});
	},
});

export default WallObject;