topo-engine 0.1.3 → 0.1.4

package/README.md

@@ -7,7 +7,7 @@
 ## 功能特性
 
 - 🧩 **Vue 3 组件** — `TopoGraph`（画布，含标题栏 / 统计 / 适应画布 / 导出 PNG 按钮）、`SidePanel`（设备详情与上下游）、`DistanceTop10`（父子连线距离 Top10 面板）
-- 🎨 **深色 / 浅色双主题** — 黑底 SCADA 或白底两种画布风格，图元 / 导线 / 文字随之配套适配，可随时切换（`theme` prop 或工具栏按钮）
+- 🎨 **深色 / 浅色双主题** — 黑底 SCADA 或白底两种画布风格，图元 / 导线 / 文字随之配套适配，可随时切换（`theme` prop 或工具栏按钮）。默认浅色主题
 - 📐 **自研正交布局** — 主干沿最长路径横向铺开 + 分支带垂直直走，整图**横平竖直、0 交叉、0 重叠**，边缘路由为直线 / L 形折线
 - 🔍 **拓扑查询 API** — 节点 / 边 / 邻居 / 子树 / 主干链 / 路径 / 坐标 查询
 - 🎨 **样式控制** — 节点、边样式覆盖与批量重置
@@ -171,8 +171,8 @@ const g6Data = buildGraphData(model, layout);   // → G6 可直接消费的 { n
 | ------- | ---- | ---- |
 | `0302` | 配电变压器 | 橙色圆 + 红圈 |
 | `3301` | 开关 / 熔丝 | 红色矩形（开关名自动缩写为 K 编号） |
-| `3303` | 低压母线 | 白色短粗线 |
-| `3202` / `320300000` | 电缆终端头 / 分接点 | 三角 / 红色米字 |
+| `3303` | 低压母线 | 白色短粗线（无文字标签） |
+| `3202` / `320300000` | 电缆终端头 / 分接点 | 三角 / 红色米字（无文字标签） |
 | `310100000` | 低压导线 | 青色连接点（名称缩写为杆号区间） |
 | `3112` | 计量箱 | 黑底白框 "JX" |
 | `3218000` | 用户接入点 | 白圈 "J"（名称缩写为户号） |
@@ -186,7 +186,7 @@ const g6Data = buildGraphData(model, layout);   // → G6 可直接消费的 { n
 | ---- | ---- | ---- | ---- |
 | `dataUrl` | `String` | `''` | 拓扑 JSON 的 URL（内部 `fetch` 加载）。变化后自动重新加载 |
 | `data` | `Object` | `null` | 直接传入 JSON 对象；优先级高于 `dataUrl`；深度 watch，变化自动重绘 |
-| `theme` | `'dark' \| 'light'` | `'dark'` | 画布主题：`dark`（黑底 SCADA，默认）/ `light`（白底，图元配套加深）。支持 `v-model:theme`，也可点内置工具栏 ☀️/🌙 按钮切换 |
+| `theme` | `'dark' \| 'light'` | `'light'` | 画布主题：`dark`（黑底 SCADA）/ `light`（白底，图元配套加深，默认）。支持 `v-model:theme`，也可点内置工具栏 ☀️/🌙 按钮切换 |
 
 ### Emits
 
@@ -218,7 +218,7 @@ const g6Data = buildGraphData(model, layout);   // → G6 可直接消费的 { n
 
 ### 主题切换（深色 / 浅色）
 
-引擎内置两套主题，**深色为默认**（黑底 SCADA 风格，与历史版本一致）；浅色为**白底**，图元（变压器 / 开关 / 计量箱 / 用户圈…）、导线（干线深灰 / 支线浅灰）、节点文字都已配套加深，适合打印或嵌入浅色页面。
+引擎内置两套主题，**浅色为默认**（白底，图元配套深色，适合打印或嵌入浅色页面）；深色为**黑底 SCADA 风格**。
 
 - `TopoGraph`：`:theme` 取值 `'dark'`（默认）或 `'light'`，推荐 `v-model:theme` 双向绑定；组件左上工具栏内置 ☀️ / 🌙 切换按钮（点击 emit `update:theme`）。
 - `SidePanel` / `DistanceTop10`：同样接收 `theme` prop，与画布保持一致观感。
@@ -230,7 +230,7 @@ import { ref } from 'vue';
 import { TopoGraph } from 'topo-engine';
 import 'topo-engine/style.css';
 
-const theme = ref('dark');          // 初始深色，可在运行时切换
+const theme = ref('light');          // 初始浅色（默认），可在运行时切换
 const dataUrl = ref('/data/topology.json');
 </script>
 
@@ -347,6 +347,13 @@ topo.off('node:click', handler); // 不传 handler 则移除该事件全部监
 
 `exportPng(filename?)`（整图下载）、`toDataURL(opts?)`、`getGraphData()`、`getGraphInstance()`（原始 G6 Graph）、`getModel()`、`getLayoutData()`、`getNodeByIdMap()`、`update(graph, model, layout, map)`、`destroy()`
 
+## 文字渲染
+
+- **设备标签自动换行**：开关标签、站房标题、下方名称标签等文字根据设备宽度自动换行，避免文字重叠
+- **站房标题自适应高度**：站房框高度会根据标题换行行数自动扩展，确保多行标题完整显示在框内
+- **母线 / 电缆终端头**：不渲染额外文字标签（母线不显示"母线"，电缆终端头不显示名称）
+- **站房标题**：使用独立属性 `_stationTitle` 渲染，避免 G6 默认 label 重复绘制
+
 ## 布局与渲染参数
 
 `computeOrthogonalLayout(model, options)`：

package/dist/topo-engine.cjs

@@ -28533,7 +28533,7 @@ const _sfc_main = {
   }
 };
 const DistanceTop10 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-438b6017"]]);
-const VERSION = "0.1.3";
+const VERSION = "0.1.4";
 const DESCRIPTION = "配电台区单线图拓扑成图引擎";
 exports.DESCRIPTION = DESCRIPTION;
 exports.DistanceTop10 = DistanceTop10;