@hzab/map-combine 0.0.1 → 0.1.2

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 (29) hide show
  1. package/CHANGELOG.md +5 -0
  2. package/package.json +2 -2
  3. package/src/basic/BasicBusiness.ts +72 -0
  4. package/src/basic/BasicElement.ts +35 -0
  5. package/src/basic/BasicMarker.ts +45 -0
  6. package/src/basic/MapCombine.ts +11 -1
  7. package/src/basic/MapElement.ts +15 -17
  8. package/src/basic/ReactPopup.tsx +24 -1
  9. package/src/basic/Tile3D.ts +76 -41
  10. package/src/cesium/CesiumEvent.ts +18 -29
  11. package/src/cesium/CesiumMap.ts +148 -53
  12. package/src/cesium/CesiumTile3D.ts +184 -55
  13. package/src/cesium/cesium-tile-covert/index.js +48 -0
  14. package/src/cesium/cesium-tile-covert/modules/index.js +12 -0
  15. package/src/cesium/cesium-tile-covert/modules/projection/BD09Projection.js +377 -0
  16. package/src/cesium/cesium-tile-covert/modules/provider/AMapImageryProvider.js +27 -0
  17. package/src/cesium/cesium-tile-covert/modules/provider/BaiduImageryProvider.js +58 -0
  18. package/src/cesium/cesium-tile-covert/modules/provider/GeoVisImageryProvider.js +25 -0
  19. package/src/cesium/cesium-tile-covert/modules/provider/GoogleImageryProvider.js +27 -0
  20. package/src/cesium/cesium-tile-covert/modules/provider/TdtImageryProvider.js +23 -0
  21. package/src/cesium/cesium-tile-covert/modules/provider/TencentImageryProvider.js +41 -0
  22. package/src/cesium/cesium-tile-covert/modules/tiling-scheme/BD09TilingScheme.js +100 -0
  23. package/src/cesium/cesium-tile-covert/modules/tiling-scheme/CustomGeographicTilingScheme.js +60 -0
  24. package/src/cesium/cesium-tile-covert/modules/tiling-scheme/CustomMercatorTilingScheme.js +70 -0
  25. package/src/cesium/cesium-tile-covert/modules/tiling-scheme/GCJ02TilingScheme.js +33 -0
  26. package/src/cesium/cesium-tile-covert/modules/transform/CoordTransform.js +148 -0
  27. package/src/openlayer/OpenlayerMap.ts +82 -27
  28. package/src/openlayer/openlayer-tile-gcj02-wgs84.js +144 -0
  29. package/src/utils/index.ts +15 -2
@@ -1,9 +1,11 @@
1
+ import { AMapImageryProvider } from "./cesium-tile-covert";
1
2
 
2
3
  import { MapCombine } from "../basic/MapCombine";
3
4
  import { PointOption, Point } from "../basic/Point";
4
5
  import { PolygonOption, Polygon } from "../basic/Polygon";
5
6
  import { PolylineOption, Polyline } from "../basic/Polyline";
6
7
  import { Tile3DOption, Tile3D } from "../basic/Tile3D";
8
+
7
9
  import { bindEvent } from "./CesiumEvent";
8
10
  import { drawPoint } from "./CesiumPoint";
9
11
  import { drawPolygon } from "./CesiumPolygon";
@@ -13,19 +15,17 @@ import { drawTile3D } from "./CesiumTile3D";
13
15
  const $m = 20037508.34278924;
14
16
 
15
17
  export class CesiumMap extends MapCombine {
16
-
17
18
  viewer: any;
18
19
  markers: any;
20
+ option;
19
21
 
20
22
  container: HTMLDivElement;
21
23
 
22
-
23
-
24
24
  get cursor(): string {
25
- return (this.container).style.cursor
25
+ return this.container.style.cursor;
26
26
  }
27
27
  set cursor(val: string) {
28
- (this.container).style.cursor = val
28
+ this.container.style.cursor = val;
29
29
  }
30
30
 
31
31
  get moveable(): boolean {
@@ -40,13 +40,10 @@ export class CesiumMap extends MapCombine {
40
40
  const height = container.offsetHeight;
41
41
  const position = viewer.scene.camera.pickEllipsoid(
42
42
  new Cesium.Cartesian2(width / 2, height / 2),
43
- viewer.scene.globe.ellipsoid
43
+ viewer.scene.globe.ellipsoid,
44
44
  );
45
45
  const cartographic = Cesium.Cartographic.fromCartesian(position);
46
- return [
47
- Cesium.Math.toDegrees(cartographic.longitude),
48
- Cesium.Math.toDegrees(cartographic.latitude),
49
- ]
46
+ return [Cesium.Math.toDegrees(cartographic.longitude), Cesium.Math.toDegrees(cartographic.latitude)];
50
47
  }
51
48
  set center(val: number[]) {
52
49
  const { viewer, container } = this;
@@ -54,22 +51,25 @@ export class CesiumMap extends MapCombine {
54
51
  const height = container.offsetHeight;
55
52
  const position = viewer.scene.camera.pickEllipsoid(
56
53
  new Cesium.Cartesian2(width / 2, height / 2),
57
- viewer.scene.globe.ellipsoid
54
+ viewer.scene.globe.ellipsoid,
58
55
  );
59
- const target = Cesium.Cartesian3.fromDegrees(...val)
60
- Cesium.Cartesian3.subtract(target, position, target)
61
- Cesium.Cartesian3.add(this.viewer.camera.position, target, this.viewer.camera.position)
56
+ const target = Cesium.Cartesian3.fromDegrees(...val);
57
+ Cesium.Cartesian3.subtract(target, position, target);
58
+ Cesium.Cartesian3.add(this.viewer.camera.position, target, this.viewer.camera.position);
62
59
  }
63
60
 
64
61
  get zoom(): number {
65
- const cartographic = Cesium.Cartographic.fromCartesian(this.viewer.camera.position)
66
- return this.distanceTzoom(cartographic.height)
62
+ const cartographic = Cesium.Cartographic.fromCartesian(this.viewer.camera.position);
63
+ return this.distanceTzoom(cartographic.height);
67
64
  }
68
65
  set zoom(val: number) {
69
-
70
- const cartographic = Cesium.Cartographic.fromCartesian(this.viewer.camera.position)
71
- cartographic.height = this.zoomTdistance(val)
72
- this.viewer.camera.position = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, cartographic.height)
66
+ const cartographic = Cesium.Cartographic.fromCartesian(this.viewer.camera.position);
67
+ cartographic.height = this.zoomTdistance(val);
68
+ this.viewer.camera.position = Cesium.Cartesian3.fromRadians(
69
+ cartographic.longitude,
70
+ cartographic.latitude,
71
+ cartographic.height,
72
+ );
73
73
  }
74
74
 
75
75
  fov = 0.9695385667699215;
@@ -82,57 +82,145 @@ export class CesiumMap extends MapCombine {
82
82
  return ($m * height) / (256 * Math.tan(this.fov / 2) * Math.pow(2, zoom));
83
83
  }
84
84
 
85
- constructor(viewer: any) {
86
- super()
87
- this.viewer = viewer
88
- this.container = viewer.container
89
- this.container.appendChild(this.htmllayer)
90
- this.cursor = 'default'
91
- this.markers = this.viewer.scene.primitives.add(
92
- new Cesium.BillboardCollection()
93
- );
94
- bindEvent(this)
85
+ constructor(viewer?: any) {
86
+ super();
87
+ this._initParamsEvent(viewer);
88
+ }
89
+
90
+ init(opt) {
91
+ this.option = opt;
92
+ const { container, center = [120.2288892, 30.2349677, 0], zoom = 13, url } = opt || {};
93
+ const viewer = new Cesium.Viewer(container, {
94
+ vrButton: false,
95
+ // 检索
96
+ geocoder: false,
97
+ // home
98
+ homeButton: false,
99
+ // 切换3d地图
100
+ sceneModePicker: false,
101
+ // 底图切换按钮
102
+ baseLayerPicker: false,
103
+ // 问号
104
+ navigationHelpButton: false,
105
+ // 动画控制
106
+ animation: false,
107
+ // 版权信息
108
+ creditContainer: document.createElement("div"),
109
+ // 时间轴
110
+ timeline: false,
111
+ // 全屏按钮
112
+ fullscreenButton: false,
113
+ selectionIndicator: false,
114
+ // 打开动画
115
+ shouldAnimate: false,
116
+ infoBox: false,
117
+ // 只进行3d渲染,没有2d,2.5d,提高性能
118
+ scene3DOnly: true,
119
+ // 初始设置一个纯色瓦片,避免报错影响后续瓦片加载
120
+ imageryProvider: new Cesium.SingleTileImageryProvider({
121
+ url: createColorCanvas("#333"),
122
+ rectangle: Cesium.Rectangle.fromDegrees(-180.0, -90.0, 180.0, 90.0),
123
+ }),
124
+ });
125
+
126
+ // viewer.cesiumWidget.creditContainer.remove();
127
+
128
+ // viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
129
+
130
+ this._initParamsEvent(viewer);
131
+
132
+ // 处理瓦片
133
+ this._createLayer();
134
+
135
+ const map = this;
136
+ const d = Cesium.Cartesian3.fromDegrees(...center);
137
+ map.setView([d.x, d.y, d.z, 6.283185307179586, -1.5691285980481942, 0]);
138
+ map.center = center;
139
+ map.zoom = zoom;
140
+
141
+ return map;
142
+ }
143
+
144
+ private _initParamsEvent(viewer) {
145
+ if (!viewer) {
146
+ return;
147
+ }
148
+ this.viewer = viewer;
149
+
150
+ this.container = viewer?.container;
151
+ this.container.appendChild(this.htmllayer);
152
+ this.cursor = "default";
153
+ this.markers = this.viewer.scene.primitives.add(new Cesium.BillboardCollection());
154
+
155
+ bindEvent(this);
156
+ }
157
+
158
+ private _createLayer() {
159
+ const { url, subdomains, proj, minZoomLevel, maxZoomLevel } = this.option;
160
+ let layer: any;
161
+ console.log("url", url);
162
+ let options = {
163
+ ...this.option,
164
+ };
165
+
166
+ switch (proj) {
167
+ case "GCJ02->WGS84":
168
+ options = {
169
+ ...options,
170
+ crs: "WGS84", // 使用84坐标系,默认为:GCJ02
171
+ };
172
+ layer = this.viewer.imageryLayers.addImageryProvider(new AMapImageryProvider(options));
95
173
 
174
+ break;
175
+ default:
176
+ options = {
177
+ ...options,
178
+ tilingScheme: new Cesium.WebMercatorTilingScheme(),
179
+ };
180
+ layer = this.viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider(options));
181
+ break;
182
+ }
183
+
184
+ this.viewer.imageryLayers.add(layer);
185
+
186
+ return layer;
96
187
  }
97
188
 
98
189
  getView() {
99
- const { camera } = this.viewer
100
- return [
101
- camera.position.x, camera.position.y, camera.position.z,
102
- camera.heading, camera.pitch, camera.roll,
103
- ]
190
+ const { camera } = this.viewer;
191
+ return [camera.position.x, camera.position.y, camera.position.z, camera.heading, camera.pitch, camera.roll];
104
192
  }
105
193
 
106
194
  setView(e: number[]) {
107
- const { camera } = this.viewer
195
+ const { camera } = this.viewer;
108
196
  camera.setView({
109
197
  destination: new Cesium.Cartesian3(e[0], e[1], e[2]),
110
- orientation: new Cesium.HeadingPitchRoll(e[3], e[4], e[5])
198
+ orientation: new Cesium.HeadingPitchRoll(e[3], e[4], e[5]),
111
199
  });
112
200
  }
113
201
 
114
202
  createPoint<K>(option?: Partial<PointOption<K>>): Point<K> {
115
- const e = new Point(this, option)
116
- drawPoint(this, e)
117
- return e
203
+ const e = new Point(this, option);
204
+ drawPoint(this, e);
205
+ return e;
118
206
  }
119
207
 
120
208
  createPolyline<K>(option?: Partial<PolylineOption<K>>): Polyline<K> {
121
- const e = new Polyline(this, option)
122
- drawPolyline(this, e)
123
- return e
209
+ const e = new Polyline(this, option);
210
+ drawPolyline(this, e);
211
+ return e;
124
212
  }
125
213
 
126
214
  createPolygon<K>(option?: Partial<PolygonOption<K>>): Polygon<K> {
127
- const e = new Polygon(this, option)
128
- drawPolygon(this, e)
129
- return e
215
+ const e = new Polygon(this, option);
216
+ drawPolygon(this, e);
217
+ return e;
130
218
  }
131
219
 
132
220
  createTile3D(option?: Partial<Tile3DOption>): Tile3D {
133
- const e = new Tile3D(this, option)
134
- drawTile3D(this, e)
135
- return e
221
+ const e = new Tile3D(this, option);
222
+ drawTile3D(this, e);
223
+ return e;
136
224
  }
137
225
 
138
226
  canvasTgeography(p: number[]): number[] {
@@ -159,9 +247,16 @@ export class CesiumMap extends MapCombine {
159
247
  }
160
248
  return [res.x, res.y];
161
249
  }
162
-
163
-
164
-
165
-
166
250
  }
167
251
 
252
+ function createColorCanvas(color) {
253
+ var width = 1,
254
+ height = 1;
255
+ var canvas = document.createElement("canvas");
256
+ canvas.width = width;
257
+ canvas.height = height;
258
+ var ctx = canvas.getContext("2d");
259
+ ctx.fillStyle = color;
260
+ ctx.fillRect(0, 0, width, height);
261
+ return canvas.toDataURL();
262
+ }
@@ -1,100 +1,229 @@
1
+ import { fill } from "lodash";
2
+
1
3
  import { Tile3D } from "../basic/Tile3D";
2
4
  import { CesiumMap } from "./CesiumMap";
3
5
 
6
+ import { arrayFillByLen } from "../utils";
7
+
4
8
  function create3DTile(tile3d: Tile3D) {
5
9
  const tileset = new Cesium.Cesium3DTileset({
6
10
  show: tile3d.show,
7
11
  url: tile3d.src,
8
12
  });
9
- tileset.maximumScreenSpaceError = 18 * (1 - tile3d.quality)
10
- tileset.readyPromise
11
- return tileset
13
+ tileset.maximumScreenSpaceError = 18 * (1 - tile3d.quality);
14
+ tileset.readyPromise;
15
+ return tileset;
12
16
  }
13
17
 
14
18
  function updateMatrix(tileset: any, tile3d: Tile3D, origin: any) {
15
-
19
+ const options = tile3d._option;
20
+ // 中心点移动到指定经纬度
16
21
  if (tile3d.coordinates) {
17
- // const center = Cesium.Matrix4.multiplyByPoint(tileset.modelMatrix, tileset.boundingSphere.center, new Cesium.Cartesian3())
18
- // const cartographic = Cesium.Cartographic.fromCartesian(center)
19
- // console.log(Cesium.Math.toDegrees(cartographic.longitude), Cesium.Math.toDegrees(cartographic.latitude), cartographic.height);
20
- // cartographic.height = 0
21
- // const transform = Cesium.Transforms.eastNorthUpToFixedFrame(Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude));
22
- // const res = Cesium.Matrix4.inverse(transform, new Cesium.Matrix4());
23
- // console.log(inverse);
24
-
25
- const target = Cesium.Cartesian3.fromDegrees(...tile3d.coordinates)
22
+ const target = Cesium.Cartesian3.fromDegrees(...tile3d.coordinates);
26
23
  tileset.modelMatrix = Cesium.Matrix4.fromTranslation(Cesium.Cartesian3.subtract(target, origin, target));
27
24
  } else {
28
- tileset.modelMatrix = Cesium.Matrix4.IDENTITY
25
+ tileset.modelMatrix = Cesium.Matrix4.IDENTITY;
26
+ }
27
+ // 旋转
28
+ if (Array.isArray(options.rotates)) {
29
+ const rotates: [number, number, number] = arrayFillByLen([...options.rotates], 3, 0);
30
+ rotate(...rotates, tileset);
31
+ }
32
+ // 平移
33
+ if (options.translates) {
34
+ const translates: [number, number, number] = arrayFillByLen([...options.translates], 3, 0);
35
+ translate(...translates, tileset);
36
+ }
37
+ // 缩放
38
+ if (options.scales) {
39
+ const scales: [number, number, number] = arrayFillByLen([...options.scales], 3, 1);
40
+ scale(...scales, tileset);
29
41
  }
30
-
31
-
32
42
  }
33
43
 
34
44
  export function drawTile3D(map: CesiumMap, tile3d: Tile3D) {
35
- const { viewer } = map
36
- let tileset = create3DTile(tile3d)
37
- let origin
45
+ const { viewer } = map;
46
+ let tileset = create3DTile(tile3d);
47
+ let origin;
48
+
38
49
  viewer.scene.primitives.add(tileset).readyPromise.then(() => {
39
- const cartographic = Cesium.Cartographic.fromCartesian(tileset.boundingSphere.center)
40
- origin = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude)
41
- updateMatrix(tileset, tile3d, origin)
42
- tile3d.event.trigger('ready');
50
+ const cartographic = Cesium.Cartographic.fromCartesian(tileset.boundingSphere.center);
51
+ origin = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude);
52
+ updateMatrix(tileset, tile3d, origin);
53
+ tile3d.event.trigger("ready");
43
54
 
44
55
  // (window as any).getCenter = () => {
45
56
  // const center = tileset.boundingSphere.center
46
57
  // const cartographic = Cesium.Cartographic.fromCartesian(center)
47
58
  // console.log(Cesium.Math.toDegrees(cartographic.longitude), Cesium.Math.toDegrees(cartographic.latitude), cartographic.height);
48
59
  // }
49
-
50
60
  });
51
61
 
52
62
  const onUpdate = (e: Set<string>) => {
53
-
54
- e.forEach(key => {
63
+ e.forEach((key) => {
55
64
  switch (key) {
56
- case 'show':
57
- tileset.show = tile3d.show
65
+ case "show":
66
+ tileset.show = tile3d.show;
58
67
  break;
59
- case 'src':
60
- viewer.scene.primitives.remove(tileset)
61
- tileset = create3DTile(tile3d)
68
+ case "src":
69
+ viewer.scene.primitives.remove(tileset);
70
+ tileset = create3DTile(tile3d);
62
71
  viewer.scene.primitives.add(tileset).readyPromise.then(() => {
63
- const cartographic = Cesium.Cartographic.fromCartesian(tileset.boundingSphere.center)
64
- origin = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude)
65
- updateMatrix(tileset, tile3d, origin)
66
- tile3d.event.trigger('ready');
67
-
72
+ const cartographic = Cesium.Cartographic.fromCartesian(tileset.boundingSphere.center);
73
+ origin = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude);
74
+ updateMatrix(tileset, tile3d, origin);
75
+ tile3d.event.trigger("ready");
68
76
  });
69
77
  break;
70
- case 'coordinates':
71
- if (!e.has('src')) {
72
- updateMatrix(tileset, tile3d, origin)
78
+ case "coordinates":
79
+ if (!e.has("src")) {
80
+ updateMatrix(tileset, tile3d, origin);
73
81
  }
74
82
  break;
75
83
 
76
- case 'quality':
77
- tileset.maximumScreenSpaceError = 18 * (1 - tile3d.quality)
84
+ case "quality":
85
+ tileset.maximumScreenSpaceError = 18 * (1 - tile3d.quality);
78
86
  break;
79
87
  default:
80
- throw new Error(`${key} 还不支持修改`)
88
+ throw new Error(`${key} 还不支持修改`);
81
89
  }
82
- })
83
-
84
-
85
- }
90
+ });
91
+ };
86
92
  const onFocus = () => {
87
93
  viewer.flyTo(tileset);
88
- }
94
+ };
89
95
 
90
96
  const onDestroy = () => {
91
- viewer.scene.primitives.remove(tileset)
92
- tile3d.event.off('update', onUpdate)
93
- tile3d.event.off('focus', onFocus)
94
- tile3d.event.off('destroy', onDestroy)
97
+ viewer.scene.primitives.remove(tileset);
98
+ tile3d.event.off("update", onUpdate);
99
+ tile3d.event.off("focus", onFocus);
100
+ tile3d.event.off("destroy", onDestroy);
101
+ };
102
+
103
+ tile3d.tileset = tileset;
104
+ tile3d.translate = function (x: number, y: number, z: number, _tileset) {
105
+ return tileset.readyPromise.then((argument) => {
106
+ console.log("debug translate tileset.readyPromise");
107
+ test();
108
+ translate(x, y, z, _tileset || tileset);
109
+ });
110
+ };
111
+ tile3d.rotate = function (x: number, y: number, z: number, _tileset) {
112
+ return tileset.readyPromise.then((argument) => {
113
+ rotate(x, y, z, _tileset || tileset);
114
+ });
115
+ };
116
+ tile3d.scale = function (x: number, y: number, z: number, _tileset) {
117
+ return tileset.readyPromise.then((argument) => {
118
+ scale(x, y, z, _tileset || tileset);
119
+ });
120
+ };
121
+
122
+ tile3d.event.on("update", onUpdate);
123
+ tile3d.event.on("focus", onFocus);
124
+ tile3d.event.on("destroy", onDestroy);
125
+ }
126
+
127
+ function test() {
128
+ console.log("debug test");
129
+ }
130
+
131
+ /** 基于本地的 ENU 坐标系的偏移,也就是垂直于地表向上为 Z,东为 X,北为 Y
132
+ * @param dx x轴偏移量。单位:米
133
+ * @param dy y轴偏移量。单位:米
134
+ * @param dz z轴偏移量。单位:米
135
+ * @param tileset Cesium3DTileset
136
+ */
137
+ function translate(dx: number, dy: number, dz: number, tileset) {
138
+ console.log("debug translate", dx, dy, dz);
139
+ if (dx === 0 && dy === 0 && dz === 0) return;
140
+ console.log("debug translate", dx, dy, dz);
141
+
142
+ try {
143
+ const { Cartesian3, Matrix4, Transforms } = Cesium;
144
+ // 对于3DTileset,我们需要的结果是一个模型矩阵,那么平移就是计算一个世界坐标下的平移矩阵。
145
+ // 获取中心点
146
+ const origin = tileset.boundingSphere.center;
147
+ // 以该点建立ENU坐标系
148
+ const toWorldMatrix = Transforms.eastNorthUpToFixedFrame(origin);
149
+ // 该坐标系下平移后的位置
150
+ const translatePosition = new Cartesian3(dx, dy, dz);
151
+ // 获取平移后位置的世界坐标
152
+ const worldPosition = Matrix4.multiplyByPoint(toWorldMatrix, translatePosition, new Cartesian3());
153
+ // 计算世界坐标下的各个平移量
154
+ const offset = Cartesian3.subtract(worldPosition, origin, new Cartesian3());
155
+ // 从世界坐标下的平移量计算世界坐标的平移矩阵
156
+ const translateMatrix = Matrix4.fromTranslation(offset);
157
+ // 应用平移矩阵。这里应该与原本的模型矩阵点乘,而不是直接赋值
158
+ tileset.modelMatrix = Matrix4.multiply(translateMatrix, tileset.modelMatrix, new Matrix4());
159
+ } catch (error) {
160
+ console.error(error);
95
161
  }
96
- tile3d.event.on('update', onUpdate)
97
- tile3d.event.on('focus', onFocus)
98
- tile3d.event.on('destroy', onDestroy)
162
+ }
99
163
 
100
- }
164
+ /** 基于本地的 ENU 坐标系的旋转,也就是垂直于地表向上为 Z,东为 X,北为 Y
165
+ * https://blog.csdn.net/weixin_70945905/article/details/142419968
166
+ * @param rx 绕X轴旋转的角度。单位:度
167
+ * @param ry 绕Y轴旋转的角度。单位:度
168
+ * @param rz 绕Z轴旋转的角度。单位:度
169
+ * @param tileset Cesium3DTileset
170
+ */
171
+ function rotate(rx: number, ry: number, rz: number, tileset) {
172
+ console.log("debug rotate ", rx, ry, rz);
173
+ if (rx === 0 && ry === 0 && rz === 0) return;
174
+ const { Matrix3, Matrix4, Transforms, Math: CesiumMath } = Cesium;
175
+ // 获取中心点。
176
+ const origin = tileset.boundingSphere.center;
177
+ // 以该点建立 ENU 坐标系
178
+ const toWorldMatrix = Transforms.eastNorthUpToFixedFrame(origin);
179
+ // 获取 ENU 矩阵的逆矩阵。也就是可以将世界坐标重新转为 ENU 坐标系的矩阵
180
+ const toLocalMatrix = Matrix4.inverse(toWorldMatrix, new Matrix4());
181
+ // 计算旋转矩阵
182
+ const rotateMatrix = Matrix4.clone(Matrix4.IDENTITY);
183
+ if (rx !== 0) {
184
+ const rotateXMatrix = Matrix4.fromRotationTranslation(Matrix3.fromRotationX(CesiumMath.toRadians(rx)));
185
+ Matrix4.multiply(rotateXMatrix, rotateMatrix, rotateMatrix);
186
+ }
187
+ if (ry !== 0) {
188
+ const rotateYMatrix = Matrix4.fromRotationTranslation(Matrix3.fromRotationY(CesiumMath.toRadians(ry)));
189
+ Matrix4.multiply(rotateYMatrix, rotateMatrix, rotateMatrix);
190
+ }
191
+ if (rz !== 0) {
192
+ const rotateZMatrix = Matrix4.fromRotationTranslation(Matrix3.fromRotationZ(CesiumMath.toRadians(rz)));
193
+ Matrix4.multiply(rotateZMatrix, rotateMatrix, rotateMatrix);
194
+ }
195
+ // ENU 坐标系下的结果矩阵
196
+ const localResultMatrix = Matrix4.multiply(rotateMatrix, toLocalMatrix, new Matrix4());
197
+ // 世界坐标系下的结果矩阵
198
+ const worldResultMatrix = Matrix4.multiply(toWorldMatrix, localResultMatrix, new Matrix4());
199
+ // 应用结果
200
+ tileset.modelMatrix = Matrix4.multiply(worldResultMatrix, tileset.modelMatrix, new Matrix4());
201
+ }
202
+
203
+ /** 基于本地的 ENU 坐标系的缩放,也就是垂直于地表向上为 Z,东为 X,北为 Y
204
+ * @param sx x 轴缩放倍数
205
+ * @param sy y 轴缩放倍数
206
+ * @param sz z 轴缩放倍数
207
+ * @param tileset Cesium3DTileset
208
+ */
209
+ function scale(sx: number, sy: number, sz: number, tileset) {
210
+ if (sx <= 0 || sy <= 0 || sz <= 0) throw Error("缩放倍数必须大于0");
211
+ if (sx === 1 && sy === 1 && sz === 1) return;
212
+ const { Cartesian3, Matrix4, Transforms } = Cesium;
213
+ // 具体步骤是将 3DTileset 先转为 ENU 坐标系,再在 ENU 坐标系下计算缩放后的结果,再转回世界坐标系。一个步骤代表一个矩阵
214
+
215
+ // 获取中心点。
216
+ const origin = tileset.boundingSphere.center;
217
+ // 以该点建立 ENU 坐标系
218
+ const toWorldMatrix = Transforms.eastNorthUpToFixedFrame(origin);
219
+ // 获取ENU矩阵的逆矩阵。也就是可以将世界坐标重新转为 ENU 坐标系的矩阵
220
+ const toLocalMatrix = Matrix4.inverse(toWorldMatrix, new Matrix4());
221
+ // 计算缩放矩阵
222
+ const scaleMatrix = Matrix4.fromScale(new Cartesian3(sx, sy, sz));
223
+ // ENU 坐标系下的结果矩阵
224
+ const localResultMatrix = Matrix4.multiply(scaleMatrix, toLocalMatrix, new Matrix4());
225
+ // 世界坐标系下的结果矩阵
226
+ const worldResultMatrix = Matrix4.multiply(toWorldMatrix, localResultMatrix, new Matrix4());
227
+ // 应用结果
228
+ tileset.modelMatrix = Matrix4.multiply(worldResultMatrix, tileset.modelMatrix, new Matrix4());
229
+ }
@@ -0,0 +1,48 @@
1
+ /**
2
+ @author : Caven Chen
3
+ @date : 2023-05-18
4
+ */
5
+
6
+ import {
7
+ AMapImageryProvider,
8
+ BaiduImageryProvider,
9
+ GeoVisImageryProvider,
10
+ GoogleImageryProvider,
11
+ TdtImageryProvider,
12
+ TencentImageryProvider,
13
+ CustomGeographicTilingScheme,
14
+ CustomMercatorTilingScheme,
15
+ } from "./modules";
16
+
17
+ if (window && window.Cesium) {
18
+ if (Object.isFrozen(window.Cesium)) {
19
+ window.AMapImageryProvider = AMapImageryProvider;
20
+ window.BaiduImageryProvider = BaiduImageryProvider;
21
+ window.GeoVisImageryProvider = GeoVisImageryProvider;
22
+ window.GoogleImageryProvider = GoogleImageryProvider;
23
+ window.TdtImageryProvider = TdtImageryProvider;
24
+ window.TencentImageryProvider = TencentImageryProvider;
25
+ window.CustomGeographicTilingScheme = CustomGeographicTilingScheme;
26
+ window.CustomMercatorTilingScheme = CustomMercatorTilingScheme;
27
+ } else {
28
+ window.Cesium.AMapImageryProvider = AMapImageryProvider;
29
+ window.Cesium.BaiduImageryProvider = BaiduImageryProvider;
30
+ window.Cesium.GeoVisImageryProvider = GeoVisImageryProvider;
31
+ window.Cesium.GoogleImageryProvider = GoogleImageryProvider;
32
+ window.Cesium.TdtImageryProvider = TdtImageryProvider;
33
+ window.Cesium.TencentImageryProvider = TencentImageryProvider;
34
+ window.Cesium.CustomGeographicTilingScheme = CustomGeographicTilingScheme;
35
+ window.Cesium.CustomMercatorTilingScheme = CustomMercatorTilingScheme;
36
+ }
37
+ }
38
+
39
+ export {
40
+ AMapImageryProvider,
41
+ BaiduImageryProvider,
42
+ GeoVisImageryProvider,
43
+ GoogleImageryProvider,
44
+ TdtImageryProvider,
45
+ TencentImageryProvider,
46
+ CustomGeographicTilingScheme,
47
+ CustomMercatorTilingScheme,
48
+ };
@@ -0,0 +1,12 @@
1
+ /**
2
+ * @Author: Caven Chen
3
+ */
4
+
5
+ export { default as AMapImageryProvider } from "./provider/AMapImageryProvider.js";
6
+ export { default as BaiduImageryProvider } from "./provider/BaiduImageryProvider.js";
7
+ export { default as GeoVisImageryProvider } from "./provider/GeoVisImageryProvider.js";
8
+ export { default as GoogleImageryProvider } from "./provider/GoogleImageryProvider.js";
9
+ export { default as TdtImageryProvider } from "./provider/TdtImageryProvider.js";
10
+ export { default as TencentImageryProvider } from "./provider/TencentImageryProvider.js";
11
+ export { default as CustomGeographicTilingScheme } from "./tiling-scheme/CustomGeographicTilingScheme.js";
12
+ export { default as CustomMercatorTilingScheme } from "./tiling-scheme/CustomMercatorTilingScheme.js";