ino-cesium 0.0.10 → 0.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.MD +149 -17
  2. package/package.json +8 -8
package/README.MD CHANGED
@@ -1,40 +1,172 @@
1
1
  # ino-cesium
2
2
 
3
3
  * TS开发，无框架束缚。
4
-
5
- <!-- TOC -->
6
4
  * [@ino-cesium/common](https://www.npmjs.com/package/@ino-cesium/common) 公共基础包
7
- <!-- TOC -->
8
-
9
- <!-- TOC -->
10
5
  * [@ino-cesium/draw](https://www.npmjs.com/package/@ino-cesium/draw) 绘制, 量测
11
- <!-- TOC -->
12
- <!-- TOC -->
13
6
  * [@ino-cesium/layers](https://www.npmjs.com/package/@ino-cesium/layers) 各类图层加载
14
- <!-- TOC -->
15
- <!-- TOC -->
16
7
  * [@ino-cesium/material](https://www.npmjs.com/package/@ino-cesium/material) 自定义材质
17
- <!-- TOC -->
18
- <!-- TOC -->
19
8
  * [@ino-cesium/primitive](https://www.npmjs.com/package/@ino-cesium/primitive) 自定义primitive
20
- <!-- TOC -->
21
- <!-- TOC -->
22
9
  * [@ino-cesium/analysis](https://www.npmjs.com/package/@ino-cesium/analysis) 客户端分析
23
- <!-- TOC -->
24
- <!-- TOC -->
25
10
  * [@ino-cesium/effects](https://www.npmjs.com/package/@ino-cesium/effects) 后期处理，特效
26
- <!-- TOC -->
27
11
 
12
+ ## 安装
28
13
  ```shell
29
14
  npnm install cesium ino-cesium
30
15
  ```
31
16
 
17
+ ## 创建cesium
18
+
19
+ ### 初始化
32
20
  ```javascript
33
21
 
34
22
  import '@ino-cesium/common/ino-css'
35
23
 
36
24
  import { initCesium } from "ino-cesium";
37
25
 
38
- const viewer = initCesium('cesium-container')
26
+ const viewer = initCesium('cesium-container',{
27
+ token:'cesium token',
28
+ // cesium 配置项
29
+ animation: false, // 是否创建动画小器件，左下角仪表
30
+ baseLayerPicker: false, // 是否显示图层选择器
31
+ fullscreenButton: false, // 是否显示全屏按钮
32
+ geocoder: false, // 是否显示geocoder小器件，右上角查询按钮
33
+ ...
34
+ })
35
+
36
+ ```
37
+
38
+ ### 事件监听
39
+
40
+ ``` ts
41
+ initCesiumEvent(viewer, {
42
+ // 左键获取位置，经纬度，笛卡尔,当前视角，鼠标位置
43
+ LEFT_POSITION: (e) => {
44
+ },
45
+ // 左键拾取要素
46
+ PICK_FEATURE: (pickModel,feature) => {
47
+ },
48
+ // 鼠标移动获取位置，经纬度，笛卡尔,当前视角，鼠标位置
49
+ MOVE_POSITION: (e) => {
50
+ },
51
+ // 鼠标移动拾取要素
52
+ MOVE_PICK_FEATURE: (pickModel, feature) => {
53
+ },
54
+ })
55
+ ```
56
+
57
+ ## 测绘
58
+
59
+ ### 初始化
60
+ ``` ts
61
+
62
+ // 创建绘制工具
63
+ const drawHadler = createDrawHandler(viewer)
64
+
65
+ // 绘制
66
+ drawHadler.draw({
67
+ // "polyline" | "polygon" | "point" | "circle" | "rectangle" | "vertical-line" | "vertical-surface-line"
68
+ shape: "polyline", // 绘制形状
69
+ edit: true, // 是否可编辑
70
+ measure: true, // 是否可测量
71
+ measureLabel: true, // 是否显示测量结果
72
+ measureUnit: ['m','㎡'], // 测量单位 [距离测量单位，面积测量单位]
73
+ clampToGround: false, // 是否贴地
74
+ })
75
+ ```
76
+
77
+ ### 绘制类型
78
+ ``` shell
79
+ 'polyline' 线 距离测量
80
+ 'polygon' 面 面积测量
81
+ 'point' 点 经纬度测量
82
+ 'circle' 圆 面积测量
83
+ 'rectangle' 矩形 面积测量
84
+ 'vertical-line' 垂直线 高度测量
85
+ 'vertical-surface-line' 离地垂直线 离地高度测量
86
+ ```
87
+
88
+ ### 事件监听
89
+
90
+ ``` ts
91
+ drawHadler.Event.drawEnd = (drawData) => {
92
+ console.log('drawEnd', drawData)
93
+ }
94
+
95
+ drawHadler.Event.drawEditEnd = (drawData) => {
96
+ console.log('drawEditEnd', drawData)
97
+ }
98
+
99
+ drawHadler.Event.drawRemove = (drawData) => {
100
+ console.log('drawRemove', drawData)
101
+ }
102
+
103
+ ```
104
+
105
+ ### 删除
106
+
107
+ ``` ts
108
+ // 删除绘制
109
+ drawHadler.remove(drawData)
39
110
 
111
+ // 删除所有绘制
112
+ drawHadler.removeAll()
113
+
114
+ ```
115
+
116
+ ### 设置测量样式
117
+ ```javascript
118
+ // 测量点，线，面样式默认值
119
+ drawHadler.setDrawStyle({
120
+ point: {
121
+ color: 'rgba(255,255,0,0.8)',
122
+ pixelSize: 8,
123
+ outlineColor: 'rgba(255,255,255,0.8)',
124
+ outlineWidth: 2,
125
+ disableDepthTestDistance: Number.POSITIVE_INFINITY,
126
+ },
127
+ polyline: {
128
+ width: 2,
129
+ color: 'rgba(81,255,0,0.8)',
130
+ depthFailColor: 'rgba(255,0,0,0.5)',
131
+ },
132
+ polygon: {
133
+ color: 'rgba(255,255,54,0.3)',
134
+ depthFailColor: 'rgba(255,0,0,0.3)',
135
+ },
136
+ })
137
+
138
+ ```
139
+ ### 测量单位
140
+ ```javascript
141
+ // 距离单位
142
+ const DistanceUnits = {
143
+ cm: 'cm',
144
+ 厘米: '厘米',
145
+ m: 'm',
146
+ 米: '米',
147
+ km: 'km',
148
+ 千米: '千米',
149
+ 公里: '公里',
150
+ }
151
+ // 面积单位
152
+ const AreaUnits = {
153
+ cm2: '㎡',
154
+ 平方厘米: '平方厘米',
155
+ m2: '㎡',
156
+ 平方米: '平方米',
157
+ km2: 'km²',
158
+ 平方千米: '平方千米',
159
+ 平方公里: '平方公里',
160
+ 亩: '亩',
161
+ 公顷: '公顷',
162
+ }
163
+ // 距离单位映射面积单位默认值
164
+ const UnitDisAndAreaMap = {
165
+ cm: 'cm²',
166
+ m: '㎡',
167
+ km: 'km²',
168
+ 米: '平方米',
169
+ 千米: '平方千米',
170
+ 公里: '平方公里',
171
+ }
40
172
  ```
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "ino-cesium",
3
3
  "type": "module",
4
- "version": "0.0.10",
4
+ "version": "0.0.11",
5
5
  "author": "koino",
6
6
  "keywords": [
7
7
  "cesium",
@@ -27,13 +27,13 @@
27
27
  "access": "public"
28
28
  },
29
29
  "dependencies": {
30
- "@ino-cesium/analysis": "0.0.10",
31
- "@ino-cesium/common": "0.0.10",
32
- "@ino-cesium/draw": "0.0.10",
33
- "@ino-cesium/effects": "0.0.10",
34
- "@ino-cesium/layers": "0.0.10",
35
- "@ino-cesium/material": "0.0.10",
36
- "@ino-cesium/primitive": "0.0.10"
30
+ "@ino-cesium/analysis": "0.0.11",
31
+ "@ino-cesium/common": "0.0.11",
32
+ "@ino-cesium/draw": "0.0.11",
33
+ "@ino-cesium/effects": "0.0.11",
34
+ "@ino-cesium/layers": "0.0.11",
35
+ "@ino-cesium/material": "0.0.11",
36
+ "@ino-cesium/primitive": "0.0.11"
37
37
  },
38
38
  "types": "./dist/index.d.ts",
39
39
  "scripts": {