sdk.ts 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560
  1. import cover from "./cover/index";
  2. import { createLoadPack, loadLib } from "@/utils";
  3. import {
  4. FuseModelAttrs,
  5. FuseModel,
  6. GuidePath,
  7. MeasureType,
  8. Measure as StoreMeasure,
  9. MeasurePosition,
  10. SceneType,
  11. scenes,
  12. Scene,
  13. } from "@/store";
  14. import type { Emitter } from "mitt";
  15. import {
  16. AnimationModel,
  17. AnimationModelAction,
  18. AnimationModelFrame,
  19. AnimationModelPath,
  20. TaggingPositionType,
  21. } from "@/api";
  22. import { Pos } from "@/components/drawing/dec";
  23. export enum SettingResourceType {
  24. map = "map",
  25. color = "color",
  26. envImage = "img",
  27. bottomImage = "bimg",
  28. icon = "icon",
  29. }
  30. type SceneModelAttrs = FuseModelAttrs & { select: boolean };
  31. export type SceneModel = ToChangeAPI<SceneModelAttrs> & {
  32. bus: Emitter<
  33. Pick<SceneModelAttrs, "select"> & {
  34. loadError: void;
  35. loadDone: void;
  36. loadProgress: number;
  37. changeSelect: boolean;
  38. transformChanged: {
  39. position?: SceneLocalPos;
  40. scale?: number;
  41. rotation?: SceneLocalPos;
  42. bottom?: number;
  43. };
  44. }
  45. >;
  46. destroy: () => void;
  47. moveModelTo: (mouse: { x: number; y: number }, pos?: Pos) => void;
  48. enterScaleMode: () => void;
  49. enterRotateMode: () => void;
  50. enterMoveMode: () => void;
  51. leaveTransform: () => void;
  52. getDefaultRotation: () => SceneLocalPos;
  53. enterAlignment: () => void;
  54. leaveAlignment: () => void;
  55. enterScaleSet: () => ScaleSet;
  56. leaveScaleSet: () => void;
  57. supportPano: () => boolean;
  58. flyInPano: () => void;
  59. flyOutPano: () => void;
  60. };
  61. export interface ScaleSet {
  62. setLength: (length: number) => void;
  63. startMeasure: () => void;
  64. }
  65. export type ModelAttrRange = {
  66. [key in "opacity" | "bottom" | "scale" as `${key}Range`]: {
  67. min: number;
  68. max: number;
  69. step: number;
  70. };
  71. };
  72. export type AddModelProps = Pick<FuseModel, "url" | "id"> &
  73. FuseModelAttrs & {
  74. type: string;
  75. isDynamicAdded: boolean;
  76. mode: "many" | "single";
  77. fromType: any;
  78. } & ModelAttrRange;
  79. export type SceneGuidePath = Pick<GuidePath, "speed" | "time"> & Pose;
  80. export interface SceneGuide {
  81. bus: Emitter<{ changePoint: number; playComplete: void }>;
  82. play: () => void;
  83. pause: () => void;
  84. clear: () => void;
  85. }
  86. export type ScenePos = { localPos: SceneLocalPos; modelId: FuseModel["id"] };
  87. export type ScreenPos = {
  88. trueSide: boolean;
  89. pos: ScreenLocalPos;
  90. modelId: FuseModel["id"];
  91. };
  92. export interface CameraComeToProps {
  93. position: SceneLocalPos;
  94. target?: SceneLocalPos;
  95. dur?: number;
  96. modelId?: FuseModel["id"];
  97. distance?: 1 | 2 | 3;
  98. maxDis?: number;
  99. isFlyToTag?: boolean;
  100. }
  101. export type CalcPathProps = [
  102. [SceneGuidePath, SceneGuidePath],
  103. Partial<Pick<SceneGuidePath, "time" | "speed">>
  104. ];
  105. export interface MeasureBase {
  106. destroy?: () => void;
  107. show: () => void;
  108. hide: () => void;
  109. fly: () => void;
  110. bus: Emitter<{
  111. update: [MeasurePosition["point"][], MeasurePosition["modelId"][]];
  112. highlight: boolean;
  113. }>;
  114. changeSelect: (isHight: boolean) => void;
  115. setPositions: (
  116. points: MeasurePosition["point"][],
  117. modelIds: MeasurePosition["modelId"][]
  118. ) => void;
  119. }
  120. export type Measure<T extends StoreMeasure["type"] = StoreMeasure["type"]> =
  121. MeasureBase &
  122. (T extends MeasureType.area
  123. ? { getArea: () => { value: number } }
  124. : { getDistance: () => { value: number } });
  125. export type StartMeasure<T extends StoreMeasure["type"]> = Measure<T> & {
  126. bus: Emitter<{
  127. submit: [MeasurePosition["point"][], MeasurePosition["modelId"][]];
  128. cancel: void;
  129. invalidPoint: string;
  130. }>;
  131. };
  132. export type Pose =
  133. | {
  134. position: SceneLocalPos;
  135. target: SceneLocalPos;
  136. }
  137. | {
  138. panoId: any;
  139. // model: SceneModel;
  140. modelId: string;
  141. posInModel: SceneLocalPos;
  142. rotInModel: SceneLocalPos;
  143. position: SceneLocalPos;
  144. target: SceneLocalPos;
  145. };
  146. export interface SDK {
  147. layout: HTMLDivElement;
  148. sceneBus: Emitter<{
  149. cameraChange: SceneLocalPos;
  150. floorCount: number;
  151. monitorError: void
  152. watchMonitor: void;
  153. panoModelChange: SceneModel;
  154. modeChange: { mode: "pano" | "fuse"; active: SceneModel; model: SceneModel };
  155. }>;
  156. changeMapTile: (args: { tempUrl: string; maximumLevel: number }[]) => void;
  157. exitWatchMonitor: () => void;
  158. setBackdrop: (
  159. drop: string,
  160. type: SettingResourceType,
  161. tb: { scale?: number; rotate?: number }
  162. ) => void;
  163. switchScene: (
  164. scene: { type: SceneType; num: string } | null
  165. ) => Promise<void>;
  166. startAddSth: () => void;
  167. endAddSth: () => void;
  168. addModel: (props: AddModelProps) => SceneModel;
  169. setCameraFov: (fov: number) => void;
  170. enableMap(dom: HTMLDivElement, latlng: number[]): void;
  171. switchMapType: (type: string) => void;
  172. showGrid: () => void;
  173. compassVisibility: (visibility: boolean) => void;
  174. canTurnToPanoMode: () => { model: SceneModel };
  175. hideGrid: () => void;
  176. calcPathInfo: (
  177. paths: CalcPathProps[0],
  178. info: CalcPathProps[1]
  179. ) => Required<CalcPathProps[1]>;
  180. getPositionByScreen: (
  181. screenPos: ScreenLocalPos,
  182. modelId?: FuseModel["id"]
  183. ) =>
  184. | (ScenePos & { worldPos: SceneLocalPos; localNormal: SceneLocalPos })
  185. | null;
  186. getScreenByPosition: (
  187. localPos: SceneLocalPos,
  188. modelId?: FuseModel["id"]
  189. ) => ScreenPos | null;
  190. screenshot: (width: number, height: number) => Promise<string>;
  191. getPose: (tag?: { modelId?: string; isFlyToTag: boolean }) => Pose;
  192. comeTo: (pos: CameraComeToProps) => void;
  193. comeToByLatLng: (pos: number[]) => void;
  194. enterSceneGuide: (data: SceneGuidePath[]) => SceneGuide;
  195. drawMeasure<T extends StoreMeasure["type"]>(
  196. type: T,
  197. points: MeasurePosition["point"][],
  198. modelIds: MeasurePosition["modelId"][]
  199. ): Measure<T>;
  200. startMeasure<T extends StoreMeasure["type"]>(type: T): StartMeasure<T>;
  201. createTagging: (props: Tagging3DProps) => Tagging3D;
  202. createPath: (props: PathProps) => Path;
  203. createAnimationGroup: () => AnimationGroup;
  204. goFloor: (num: number) => void;
  205. getFloorCount: () => number;
  206. generateAniPathData: () => any
  207. setFollowDevice: (macId: any) => void
  208. }
  209. export type PathProps = {
  210. id: string
  211. isAnimate: boolean
  212. // 线段名称
  213. name: string;
  214. // 是否显示名称,
  215. showName: boolean;
  216. // 文字大小
  217. fontSize: number;
  218. // 是否显示方向,
  219. showDirection: boolean;
  220. // 方向是否反向
  221. reverseDirection: boolean;
  222. line: {
  223. width: number;
  224. color: string;
  225. altitudeAboveGround: number;
  226. position?: SceneLocalPos;
  227. modelId?: string;
  228. };
  229. points: {
  230. // 点位名称
  231. name: string;
  232. position: SceneLocalPos;
  233. modelId: string;
  234. }[];
  235. };
  236. export type Path = {
  237. bus: Emitter<{
  238. changeLineHeight: number;
  239. activePoint: number;
  240. // 标注点击事件
  241. click: void;
  242. // 鼠标移入标注事件
  243. enter: void;
  244. // 鼠标移出标注事件
  245. leave: void;
  246. // 线段坐标更改事件
  247. linePositionChange: {
  248. pos: SceneLocalPos;
  249. modelId: string;
  250. };
  251. focus: boolean;
  252. // 路径点位置变更
  253. changePoints: PathProps["points"];
  254. drawed: void;
  255. }>;
  256. changeDirection: (show: boolean, reverse: boolean) => void;
  257. changeFontSize: (fontSize: number) => void;
  258. focus: (f: boolean) => void;
  259. highlight: (f: boolean) => void;
  260. changeVisibilityRange: (range: number) => void;
  261. changePointName: (index: number, name: string) => void;
  262. // 飞向路径
  263. fly: () => void;
  264. // 更改路径点
  265. changePathPoints: (
  266. points: Omit<PathProps["points"][number], "name">[]
  267. ) => void;
  268. // 播放路径,相机沿着路径运动,传入播放完毕回调
  269. play: (playedHandler: () => void) => void;
  270. // 停止播放路径
  271. pause: () => void;
  272. // 是否可编辑
  273. changeCanEdit: (canMove: boolean) => void;
  274. deletePoint: (index: number) => void;
  275. changeEditMode: (editMode: boolean) => void;
  276. // 可见性
  277. visibility: (visibility: boolean) => void;
  278. // 气泡是否可见
  279. visibilityName: (visibility: boolean) => void;
  280. // 更改标题气泡属性
  281. changeLine: (props: Partial<PathProps["line"]>) => void;
  282. // 更改标题气泡属性
  283. changeName: (name: string) => void;
  284. // 线段销毁
  285. destroy: () => void;
  286. };
  287. export type Tagging3DProps = {
  288. lineHeight: number;
  289. fontSize: number;
  290. // 标题
  291. title: string;
  292. // 标注类型 2d | 3d
  293. type: TaggingPositionType;
  294. // 模型id
  295. modelId: string;
  296. // 贴地射线获取的位置
  297. position: SceneLocalPos;
  298. normal: SceneLocalPos;
  299. // 是否可以移动
  300. canMove: boolean;
  301. // 贴地图片url
  302. image: string;
  303. // 贴地图片的变换
  304. mat: {
  305. scale: number;
  306. rotation: number;
  307. };
  308. };
  309. export type Tagging3D = {
  310. bus: Emitter<{
  311. // 标注点击事件
  312. click: void;
  313. // 鼠标移入标注事件
  314. enter: void;
  315. // 鼠标移出标注事件
  316. leave: void;
  317. // 位置变更
  318. changePosition: {
  319. pos: SceneLocalPos;
  320. modelId: string;
  321. normal: SceneLocalPos;
  322. };
  323. changeLineHeight: number;
  324. }>;
  325. changePosition: (position: {
  326. modelId: string;
  327. // 贴地射线获取的位置
  328. position: SceneLocalPos;
  329. normal: SceneLocalPos;
  330. }) => void;
  331. changeFontSize: (fontSize: number) => void;
  332. changeLineHeight: (lineHeight: number) => void;
  333. // 设置标题
  334. changeTitle: (title: string) => void;
  335. // 标题是否可见
  336. visibilityTitle: (visibility: boolean) => void;
  337. // 更改可拖拽移动
  338. changeCanMove: (canMove: boolean) => void;
  339. // 获取图标中心三维坐标
  340. getImageCenter: () => SceneLocalPos;
  341. // 更改图标
  342. changeImage: (url: string) => void;
  343. // 标注可见性
  344. visibility: (visibility: boolean) => void;
  345. // 标注图片变换,传入变换
  346. changeMat: (props: Tagging3DProps["mat"]) => void;
  347. // 更改热点类型
  348. changeType: (val: TaggingPositionType) => void;
  349. // 距离相机位置
  350. getCameraDisSquared: () => number;
  351. // 标注销毁
  352. destroy: () => void;
  353. };
  354. // 动画组对象
  355. export type AnimationGroup = {
  356. enterEditPannel: () => void,
  357. exitEditPannel: () => void,
  358. // 播放
  359. play: () => void;
  360. // 暂停
  361. pause: () => void;
  362. // 添加动画模型
  363. addAnimationModel: (data: any) => AnimationModel3D;
  364. delayEndTime: () => number;
  365. // 设置当前时间, 单位为秒
  366. setCurrentTime: (s: number) => void;
  367. bus: Emitter<{
  368. currentTime: number;
  369. }>;
  370. };
  371. export type AnimationModel3D = {
  372. getSupportActions: () => { name: string; duration: number }[];
  373. changePosition: (pos: Pos) => void;
  374. changeScale: (num: number) => void;
  375. changeRotation: (pos: SceneLocalPos) => void;
  376. // 销毁动画模型
  377. destroy: () => void;
  378. changeShow: (focus: boolean) => void;
  379. // 更改动画模型可见性
  380. changeSelect: (show: boolean) => void;
  381. // 更改动画可见范围 不传为全局可见
  382. changeVisibilityRange: (range?: number) => void;
  383. // 更改模型名称
  384. changeTitle: (name: string) => void;
  385. // 更改名称字体大小
  386. changeFontSize: (size: number) => void;
  387. // 更改名称可见性
  388. visibilityTitle: (show: boolean) => void;
  389. setDefaultPose: (data: {
  390. position?: SceneLocalPos;
  391. scale?: number;
  392. rotation?: SceneLocalPos;
  393. originPosition?: SceneLocalPos;
  394. }) => void;
  395. getModelPose: () => {
  396. position?: SceneLocalPos;
  397. scale?: number;
  398. rotation?: SceneLocalPos;
  399. originPosition?: SceneLocalPos;
  400. };
  401. moveModelTo: (mouse: { x: number; y: number }, pos?: Pos) => void;
  402. // 添加模型帧
  403. addFrame: (frame: AnimationModelFrame) => AnimationModelFrame3D;
  404. // 添加模型动作
  405. addAction: (frame: AnimationModelAction) => AnimationModelAction3D;
  406. // 添加模型路径
  407. addPath: (
  408. frame: Omit<AnimationModelPath, "pathId"> & { path: Path }
  409. ) => AnimationModelPath3D;
  410. // 获取当前模型字幕出现的适合位置,传入旁边dom的宽高,返回像素位置
  411. getCurrentSubtitlePixel: (size: { width: number; height: number }) => {
  412. x: number;
  413. y: number;
  414. };
  415. // 获取当前时间改模型的姿态
  416. getCurrentMat: () => {
  417. position?: SceneLocalPos;
  418. scale?: number;
  419. rotation?: SceneLocalPos;
  420. originPosition?: SceneLocalPos;
  421. };
  422. // 进入旋转
  423. enterRotateMode: () => void;
  424. enterMoveMode: () => void;
  425. enterScaleMode: () => void;
  426. leaveTransform: () => void;
  427. putInFrontOfCam: () => void
  428. // 动画帧姿态修改数据
  429. bus: Emitter<{
  430. loadDone: void;
  431. changeSelect: boolean;
  432. transformChanged: {
  433. byControl: boolean;
  434. position?: SceneLocalPos;
  435. scale?: number;
  436. rotation?: SceneLocalPos;
  437. originPosition?: SceneLocalPos;
  438. };
  439. }>;
  440. };
  441. export type AnimationModelFrame3D = {
  442. // 销毁动画模型帧
  443. destroy: () => void;
  444. // 修改帧播放时间 单位为秒
  445. changeTime: (s: number) => void;
  446. setMat: (mat: any) => void;
  447. };
  448. export type AnimationModelAction3D = {
  449. // 销毁动画模型动作
  450. destroy: () => void;
  451. // 修改动作播放时间 单位为秒
  452. changeTime: (s: number) => void;
  453. // 修改动作幅度
  454. changeAmplitude: (n: number) => void;
  455. // 修改动作速度
  456. changeSpeed: (n: number) => void;
  457. // 修改动持续时间 单位为秒
  458. changeDuration: (n: number) => void;
  459. chose: (b: boolean) => void;
  460. };
  461. export type AnimationModelPath3D = {
  462. // 销毁动画模型路径
  463. destroy: () => void;
  464. // 修改路径 传入参数为你之前返回的路径对象
  465. changePath: (path: Path | undefined) => void;
  466. // 修改播放是否要反向
  467. changeReverse: (reverse: boolean) => void;
  468. // 修改路径播放时间 单位为秒
  469. changeTime: (s: number) => void;
  470. // 修改路径续时间 单位为秒
  471. changeDuration: (n: number) => void;
  472. };
  473. export let sdk: SDK;
  474. export type InialSDKProps = {
  475. laserRoot?: string;
  476. ossRoot?: string;
  477. laserOSSRoot?: string;
  478. panoOSSRoot?: string;
  479. layout: HTMLDivElement;
  480. scenes: Scene[];
  481. lonlat?: number[];
  482. };
  483. export let initialed = false;
  484. export const initialSDK = async (props: InialSDKProps) => {
  485. if (initialed) return sdk;
  486. initialed = true;
  487. const libs = [
  488. `./lib/proj4/proj4.js`,
  489. `./lib/jquery/jquery-3.1.1.min.js`,
  490. `./lib/other/BinaryHeap.js`,
  491. `./lib/other/hls.js`,
  492. `./lib/tween/tween.min.js`,
  493. `./lib/plasio/js/laslaz.js`,
  494. `./lib/plasio/vendor/bluebird.js`,
  495. `./lib/plasio/workers/laz-loader-worker.js`,
  496. `./lib/plasio/workers/laz-perf.js`,
  497. `./lib/Cesium/Cesium.js`,
  498. `./lib/shapefile/shapefile.js`,
  499. ];
  500. await Promise.all(libs.map(loadLib));
  501. await loadLib(`./lib/potree/potree.js`);
  502. console.log(props);
  503. const localSdk = cover({
  504. ...props,
  505. dom: props.layout,
  506. isLocal: false,
  507. scenes: props.scenes,
  508. lonlat: props.lonlat,
  509. mapDom: null,
  510. } as any) as unknown as SDK;
  511. (window as any).sdk = sdk = localSdk;
  512. sdk.layout = props.layout;
  513. return sdk;
  514. };
  515. export default sdk!;