cesium/cesium-plot-js
1
0
Fork 0
mirror of https://github.com/ethan-zf/cesium-plot-js.git synced 2025-06-24 03:27:29 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

update docs

Browse Source
This commit is contained in:
ethan 2024-03-24 12:26:14 +08:00
parent 5062298b24
commit bdde5ebee9
2 changed files with 27 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
README.md
View File

@ -2,9 +2,16 @@
cesium 军事标绘插件,支持绘制多边形、曲线、箭头等图形 cesium 军事标绘插件,支持绘制多边形、曲线、箭头等图形
![image](https://ethan-zf.github.io/cesium-plot-js/examples/plot.png) ![image](https://ethan-zf.github.io/cesium-plot-js/examples/banner.png)
[在线示例：demo](https://ethan-zf.github.io/cesium-plot-js/examples/index.html) 淡入淡出效果：
![image](https://ethan-zf.github.io/cesium-plot-js/examples/show-hide-animation.gif)
生长动画：
![image](https://ethan-zf.github.io/cesium-plot-js/examples/attack-arrow-growth.gif)
在线示例： [demo](https://ethan-zf.github.io/cesium-plot-js/examples/index.html)
### CDN ### CDN
@ -108,22 +115,21 @@ const geometry = new CesiumPlot.FineArrow(Cesium, viewer, {
### 类的实例方法 ### 类的实例方法
| 方法名 | 参数 | 描述 | | 方法名 | 参数 | 描述 |
| ------ | --------------------------------------------------------------------- | ---------------------------------------------------- | | -------------------- | --------------------------------------------------------------------- | ---------------------------------------------------- |
| hide | options?: [VisibleAnimationOpts](#VisibleAnimationOpts) | 隐藏，options 可配置过度动画，参数缺省时，不显示动画 | | hide | options?: [AnimationOpts](#AnimationOpts) | 隐藏，options 可配置动画参数，参数缺省时，不显示动画 |
| show | options?: [VisibleAnimationOpts](#VisibleAnimationOpts) | 显示，options 可配置过度动画，参数缺省时，不显示动画 | | show | options?: [AnimationOpts](#AnimationOpts) | 显示，options 可配置动画参数，参数缺省时，不显示动画 |
| startGrowthAnimation | options?: [AnimationOpts](#AnimationOpts) | 生长动画，options 可配置动画参数 |
| remove | | 删除 | | remove | | 删除 |
| on | (event: [EventType](#EventType), listener: (eventData?: any) => void) | 绑定事件 | | on | (event: [EventType](#EventType), listener: (eventData?: any) => void) | 绑定事件 |
| off | (event: [EventType](#EventType)) | 解绑事件 | | off | (event: [EventType](#EventType)) | 解绑事件 |
<h5 id='VisibleAnimationOpts'>VisibleAnimationOpts类型</h5> <h5 id='AnimationOpts'>AnimationOpts类型</h5>
``` | 参数 | 类型 | 默认值 | 描述 |
{ | -------- | ---------- | ------ | ---------------------- |
duration?: number; // 动画持续时间（ms）,默认1000 | duration | number | 2000 | 动画持续时间（ms） |
delay?: number; // 动画延迟启动时间（ms），默认0 | delay | number | 0 | 动画延迟启动时间（ms） |
callback?: (() => void) // 动画结束回调 | callback | () => void | - | 动画结束回调 |
};
```
``` ```
// 隐藏图形 // 隐藏图形

8
src/base.ts
View File

@ -491,7 +491,7 @@ export default class Base {
} }
} }
showWithAnimation(duration: number = 1000, delay: number = 0, callback?: () => void) { showWithAnimation(duration: number = 2000, delay: number = 0, callback?: () => void) {
if (this.state != 'static' || this.isHidden === false) { if (this.state != 'static' || this.isHidden === false) {
//If not in a static state or already displayed, do not process. //If not in a static state or already displayed, do not process.
return; return;
@ -531,7 +531,7 @@ export default class Base {
} }
} }
hideWithAnimation(duration: number = 1000, delay: number = 0, callback?: () => void) { hideWithAnimation(duration: number = 2000, delay: number = 0, callback?: () => void) {
if (this.state != 'static' || this.isHidden === true) { if (this.state != 'static' || this.isHidden === true) {
return; return;
} }
@ -645,7 +645,7 @@ export default class Base {
} }
startGrowthAnimation(opts: GrowthAnimationOpts) { startGrowthAnimation(opts: GrowthAnimationOpts) {
const { duration = 3000, delay = 0, callback } = opts || {}; const { duration = 2000, delay = 0, callback } = opts || {};
if (this.state !== 'static') { if (this.state !== 'static') {
return; return;
} }
@ -716,7 +716,7 @@ export default class Base {
}, delay); }, delay);
} }
private doubleArrowGrowthAnimation(duration: number = 3000, delay: number = 0, callback?: Function) { private doubleArrowGrowthAnimation(duration: number = 2000, delay: number = 0, callback?: Function) {
setTimeout(() => { setTimeout(() => {
this.viewer.entities.remove(this.polygonEntity); this.viewer.entities.remove(this.polygonEntity);
this.viewer.entities.remove(this.outlineEntity); this.viewer.entities.remove(this.outlineEntity);