@xtctwins/tctwins-dxf-next-viewer 0.0.5 → 0.0.7

package/README.md

@@ -1,6 +1,6 @@
-# xtd 二维文件查看器 VUE3
+# xtd 二维文件查看器
 
-# 安装相关依赖
+## 安装相关依赖
 
 ## 网络请求 axios
 
@@ -31,7 +31,7 @@ npm i mitt
 <https://www.npmjs.com/package/pinia>
 
 ```ssh
-npm i pinia
+npm i pinia@3
 ```
 
 ## 3D three
@@ -45,7 +45,10 @@ npm i three
 # 安装依赖
 
 ```ssh
+// 安装依赖
 npm i @xtctwins/tctwins-dxf-next-viewer
+// 引入样式
+import "@xtctwins/tctwins-dxf-next-viewer/dist/tctwins-dxf-next-viewer.css";
 ```
 
 # 拷贝资源
@@ -56,7 +59,7 @@ npm i @xtctwins/tctwins-dxf-next-viewer
 
 # Example
 
-```vue
+```ts
 <template>
 	<TctwinsDxf
 		is-pc
@@ -97,6 +100,8 @@ npm i @xtctwins/tctwins-dxf-next-viewer
 </template>
 <script setup>
 import { ref } from "vue";
+// 引入样式
+import "@xtctwins/tctwins-dxf-next-viewer/dist/tctwins-dxf-next-viewer.css";
 import { TctwinsDxf } from "@xtctwins/tctwins-dxf-next-viewer";
 const fileUrl = ref("https://xxxxxx/demo.xtd");
 // 字体链接列表，默认字体可取tctwins-dxf-viewer/fonts下的文字路径
@@ -136,9 +141,9 @@ const eventHandle = (event) => {
 
 ### Events
 
-| 事件名      | 说明     | 回调参数                                                      |
-| ----------- | -------- | ------------------------------------------------------------- |
-| eventHandle | 事件总线 | event: { eventTarget: string;eventName: string;content: any;} |
+| 事件名      | 说明     | 回调参数                                                                               |
+| ----------- | -------- | -------------------------------------------------------------------------------------- |
+| eventHandle | 通知事件 | event: { isTool: booolean; event_target: string; event_name: string; content: object;} |
 
 ### Slots
 
@@ -273,3 +278,64 @@ closeAllTool();
 // 显示所有工具
 toggleAllTool(true);
 ```
+
+# 交互操作
+
+## 数据存储格式
+
+```ts
+interface Data {
+	id: string || number;
+	content: {
+		[key: string]: any; // 数据
+	}; // 创建方法返回的数据
+	[key: string]: any; // 用户自定义的其他数据
+}
+```
+
+## 测量相关
+
+1. 测量列表
+   window.dxfViewer.measureTool.showMeasureList([] as Data[]);
+2. 删除测量
+   window.dxfViewer.measureTool.deleteTargetObjectById(event.content.id);
+
+## 批注相关
+
+1. 批注列表
+   window.dxfViewer.commentTool.showCommentList([] as Data[]);
+2. 删除批注
+   window.dxfViewer.commentTool.deleteTargetObjectById(event.content.id);
+
+## 标注相关
+
+1. 标注列表
+   window.dxfViewer.annotationTool.showAnnotationList([] as Data[]);
+2. 删除标注
+   删除记录后重新绘制即可
+
+## 图层数据源
+
+```ts
+// 定义 LayerData 接口，用于描述图层的数据结构
+interface LayerData {
+	color: number; // 图层的颜色，使用数字表示
+	displayName: string; // 图层的显示名称
+	lineType: string; // 图层的线条类型
+	name: string; // 图层的名称
+	objects: any[]; // 图层包含的对象数组
+	visible: boolean; // 图层是否可见
+}
+// 使用 Map 类型来存储图层数据，键为字符串，值为 LayerData 对象
+const layerMap: Map<string, LayerData> = new Map(window.dxfViewer.layers);
+// 遍历图层数据，获取每个图层的信息
+for (const [key, value] of layerMap) {
+	console.log(`图层名称：${value.name}`);
+}
+```
+
+# 说明
+
+1. 是否支持移动端查看？
+
+- 目前不支持

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@xtctwins/tctwins-dxf-next-viewer",
 	"private": false,
-	"version": "0.0.5",
+	"version": "0.0.7",
 	"type": "module",
 	"main": "dist/tctwins-dxf-next-viewer.umd.js",
 	"module": "dist/tctwins-dxf-next-viewer.es.js",
@@ -19,7 +19,7 @@
 		"axios": "^1.7.9",
 		"element-plus": "^2.9.3",
 		"mitt": "^3.0.1",
-		"pinia": "^2.3.1",
+		"pinia": "^3.0.1",
 		"three": "^0.173.0",
 		"vue": "^3.5.13"
 	},