topo-engine 0.1.7 → 0.1.8

package/dist/topo-engine.js

@@ -25024,8 +25024,8 @@ function injectCustomers(model, customerMap) {
     node._customers = customers;
     if (customers.length === 1) {
       node._meterBoxMode = "single";
-      node._meterBoxW = 30;
-      node._meterBoxH = 38;
+      node._meterBoxW = 22;
+      node._meterBoxH = 30;
     } else {
       const showName = customers.length <= SHOW_NAME_LIMIT;
       const cols = Math.min(customers.length, MAX_COLS);
@@ -25098,17 +25098,26 @@ class TopoApi {
     this._nodeLabels = /* @__PURE__ */ new Map();
     this._originalNodeStyles = /* @__PURE__ */ new Map();
     this._originalEdgeStyles = /* @__PURE__ */ new Map();
+    this._nodeColorOverrides = /* @__PURE__ */ new Map();
+    this._custColorOverrides = /* @__PURE__ */ new Map();
     this._bindConnGraphEvents();
   }
   /** 数据刷新（图重新渲染后调用） */
   update(graph, model, layout, nodeByIdMap) {
+    const colorSnapshot = {
+      node: new Map(this._nodeColorOverrides),
+      cust: new Map(this._custColorOverrides)
+    };
     this.destroy();
     this._graph = graph;
     this._model = model;
     this._layout = layout;
     this._nodeByIdMap = nodeByIdMap;
     this._selectedId = null;
+    this._nodeColorOverrides = colorSnapshot.node;
+    this._custColorOverrides = colorSnapshot.cust;
     this._bindConnGraphEvents();
+    this._applyColorOverrides();
   }
   /** 销毁，释放所有资源 */
   destroy() {
@@ -25121,6 +25130,8 @@ class TopoApi {
     this._originalNodeStyles.clear();
     this._originalEdgeStyles.clear();
     this._nodeLabels.clear();
+    this._nodeColorOverrides.clear();
+    this._custColorOverrides.clear();
     this._graph = null;
     this._model = null;
     this._layout = null;
@@ -25504,6 +25515,230 @@ class TopoApi {
     this._originalNodeStyles.clear();
   }
   // ============================================================
+  //  三·五、节点 / 箱内电表户染色（支持 psrId / 资产编号 / 节点 id）
+  //
+  //  普通节点（变压器/开关/熔丝/导线点/用户接入点…）→ 图元“整图单色换装”，
+  //    主体/引线/描边换成指定色，白字与浅色细节保留可读；
+  //  箱内电表户（计量箱 grid/single 里的每只电表）→ 该户电表图标与户名染色。
+  //  引用规则与 addConnection 完全一致：
+  //    节点：节点内部 id 或 psrId（设备编码）；电表户：客户档案 assetNo（资产编号，
+  //    兼容 consNo / consId）。染色记录随数据重渲染（主题切换/换数据）自动保留重放。
+  // ============================================================
+  /**
+   * 把当前记录的染色覆盖（节点 / 电表户）重新写进图 style（update 后调用）。
+   * 仅做 updateNodeData 合并，不主动 render —— 由随后的一次 render 统一生效。
+   * 顺带清理指向已不存在节点 / 表位的过期记录（换数据后自动丢弃）。
+   */
+  _applyColorOverrides() {
+    if (!this._graph) return;
+    const updates = [];
+    if (this._nodeColorOverrides.size) {
+      const stale = [];
+      for (const [id2, color2] of this._nodeColorOverrides) {
+        if (!this._graph.getNodeData(id2)) {
+          stale.push(id2);
+          continue;
+        }
+        updates.push({ id: id2, style: { color: color2 || "" } });
+      }
+      for (const id2 of stale) this._nodeColorOverrides.delete(id2);
+    }
+    if (this._custColorOverrides.size) {
+      const byBox = /* @__PURE__ */ new Map();
+      const stale = [];
+      for (const [key, color2] of this._custColorOverrides) {
+        const sep = key.indexOf("#cust");
+        if (sep < 0) {
+          stale.push(key);
+          continue;
+        }
+        const boxId = key.slice(0, sep);
+        if (!this._graph.getNodeData(boxId)) {
+          stale.push(key);
+          continue;
+        }
+        if (!byBox.has(boxId)) byBox.set(boxId, /* @__PURE__ */ new Map());
+        byBox.get(boxId).set(Number(key.slice(sep + 5)), color2);
+      }
+      for (const [boxId, cellMap] of byBox) {
+        const cur = this._safeNodeStyle(boxId, {});
+        const customers = cur._customers;
+        if (!Array.isArray(customers) || !customers.length) continue;
+        const arr = new Array(customers.length).fill(null);
+        let any = false;
+        for (const [idx, color2] of cellMap) {
+          if (idx >= 0 && idx < arr.length && color2) {
+            arr[idx] = color2;
+            any = true;
+          }
+        }
+        updates.push({ id: boxId, style: { _cellColors: any ? arr : null } });
+      }
+      for (const key of stale) this._custColorOverrides.delete(key);
+    }
+    if (updates.length) {
+      try {
+        this._graph.updateNodeData(updates);
+      } catch (e2) {
+        console.error("[TopoApi] _applyColorOverrides error:", e2);
+      }
+    }
+  }
+  /**
+   * 写入某个解析端点的染色（setNodeColor / batchSetNodeColor 共用）。
+   * @param {{kind:'node',id:string}|{kind:'customer',boxId:string,index:number,node:object}} e
+   * @param {string|null} color 颜色；null/''/undefined = 清除该处染色
+   */
+  _writeColorEndpoint(e2, color2) {
+    if (!this._graph) return;
+    color2 = color2 == null ? null : String(color2).trim() || null;
+    if (e2.kind === "node") {
+      const id2 = e2.id;
+      if (color2) this._nodeColorOverrides.set(id2, color2);
+      else this._nodeColorOverrides.delete(id2);
+      this._updateNodes([{ id: id2, style: { color: color2 || "" } }]);
+      return;
+    }
+    const key = `${e2.boxId}#cust${e2.index}`;
+    if (color2) this._custColorOverrides.set(key, color2);
+    else this._custColorOverrides.delete(key);
+    const cur = this._safeNodeStyle(e2.boxId, {});
+    const customers = cur._customers;
+    if (!Array.isArray(customers) || !customers.length) return;
+    const arr = new Array(customers.length).fill(null);
+    let any = false;
+    for (const [k, c] of this._custColorOverrides) {
+      if (!k.startsWith(`${e2.boxId}#cust`)) continue;
+      const idx = Number(k.slice(k.indexOf("#cust") + 5));
+      if (idx >= 0 && idx < arr.length && c) {
+        arr[idx] = c;
+        any = true;
+      }
+    }
+    this._updateNodes([{ id: e2.boxId, style: { _cellColors: any ? arr : null } }]);
+  }
+  /**
+   * 给节点 / 箱内电表户设置颜色。
+   * @param {string} ref   节点内部 id / 节点 psrId（普通节点、计量箱本体）
+   *                       或 客户资产编号 assetNo（兼容 consNo/consId，箱内电表户）
+   * @param {string} [color] 颜色（'#RRGGBB' / 'red' 等）；传 null/''/undefined 清除该处染色
+   * @returns {boolean} 是否命中并设置成功
+   */
+  setNodeColor(ref2, color2) {
+    this._assertReady();
+    const e2 = this._parseEndpoint(ref2);
+    if (!e2) {
+      console.warn(`[TopoApi] setNodeColor: 无法解析目标 ${ref2}（普通节点请用 psrId/节点id，电表户请用 assetNo/consNo/consId）`);
+      return false;
+    }
+    this._writeColorEndpoint(e2, color2);
+    return true;
+  }
+  /**
+   * 批量设置颜色。三种入参形式：
+   *   1) 数组：[ ['8ff4…', '#FF0000'], ['4230…资产编号', '#00FF00'], … ]
+   *   2) 数组：[{ ref / psrId / assetNo / nodeId, color? }]（color 缺省用第 2 参）
+   *   3) 对象：{ 'psrId或assetNo': '#FF0000', … }
+   * @param {*} entries
+   * @param {string} [color] 未在单项里给色时的兜底颜色
+   * @returns {{total:number, ok:number, failed:Array<{ref:string, reason:string}>}}
+   */
+  batchSetNodeColor(entries, color2) {
+    this._assertReady();
+    const failed = [];
+    let total = 0;
+    const applyRef = (ref2, c) => {
+      total++;
+      const e2 = this._parseEndpoint(ref2);
+      if (!e2) {
+        failed.push({ ref: String(ref2), reason: "未命中任何节点/电表户" });
+        return;
+      }
+      this._writeColorEndpoint(e2, c);
+    };
+    if (Array.isArray(entries)) {
+      for (const item of entries) {
+        if (Array.isArray(item)) {
+          applyRef(item[0], item[1] != null ? item[1] : color2);
+        } else if (item && typeof item === "object") {
+          const ref2 = item.ref != null ? item.ref : item.psrId != null ? item.psrId : item.assetNo != null ? item.assetNo : item.nodeId;
+          if (ref2 == null) {
+            total++;
+            failed.push({ ref: JSON.stringify(item), reason: "缺少 ref/psrId/assetNo/nodeId" });
+            continue;
+          }
+          applyRef(ref2, item.color != null ? item.color : color2);
+        }
+      }
+    } else if (entries && typeof entries === "object") {
+      for (const [ref2, c] of Object.entries(entries)) applyRef(ref2, c);
+    }
+    return { total, ok: total - failed.length, failed };
+  }
+  /**
+   * 清除某处染色（返回节点 / 电表户到主题默认配色）。
+   * @param {string} ref 同 setNodeColor 的引用
+   */
+  resetNodeColor(ref2) {
+    this._assertReady();
+    const e2 = this._parseEndpoint(ref2);
+    if (!e2) {
+      console.warn(`[TopoApi] resetNodeColor: 无法解析目标 ${ref2}`);
+      return false;
+    }
+    this._writeColorEndpoint(e2, null);
+    return true;
+  }
+  /** 清除全部染色（所有节点与电表户回到主题默认配色） */
+  resetAllNodeColors() {
+    this._assertReady();
+    const nodeUpdates = [];
+    for (const [id2] of this._nodeColorOverrides) {
+      if (this._graph.getNodeData(id2)) nodeUpdates.push({ id: id2, style: { color: "" } });
+    }
+    const boxes = /* @__PURE__ */ new Set();
+    for (const [key] of this._custColorOverrides) {
+      const sep = key.indexOf("#cust");
+      if (sep >= 0) boxes.add(key.slice(0, sep));
+    }
+    for (const boxId of boxes) {
+      if (this._graph.getNodeData(boxId)) {
+        nodeUpdates.push({ id: boxId, style: { _cellColors: null } });
+      }
+    }
+    if (nodeUpdates.length) this._updateNodes(nodeUpdates);
+    this._nodeColorOverrides.clear();
+    this._custColorOverrides.clear();
+  }
+  /**
+   * 查询某处当前生效的染色。
+   * @param {string} ref 同 setNodeColor 的引用
+   * @returns {{ kind: 'node'|'customer', id: string, index?: number, color: string|null } | null}
+   */
+  getNodeColor(ref2) {
+    this._assertReady();
+    const e2 = this._parseEndpoint(ref2);
+    if (!e2) return null;
+    if (e2.kind === "node") {
+      const color3 = this._nodeColorOverrides.get(e2.id);
+      if (color3) return { kind: "node", id: e2.id, color: color3 };
+      const cur2 = this._safeNodeStyle(e2.id, {});
+      return { kind: "node", id: e2.id, color: cur2.color || null };
+    }
+    const key = `${e2.boxId}#cust${e2.index}`;
+    const color2 = this._custColorOverrides.get(key);
+    if (color2) return { kind: "customer", id: key, boxId: e2.boxId, index: e2.index, color: color2 };
+    const cur = this._safeNodeStyle(e2.boxId, {});
+    const arr = cur._cellColors;
+    return {
+      kind: "customer",
+      id: key,
+      boxId: e2.boxId,
+      index: e2.index,
+      color: Array.isArray(arr) && arr[e2.index] || null
+    };
+  }
+  // ============================================================
   //  四、边样式
   // ============================================================
   /** 设置边样式 */
@@ -27899,6 +28134,9 @@ function buildGraphData(model, layout) {
         size: [w, h],
         // 自定义字段（进 attributes，供 svg-symbol 节点绘制使用）
         cat: n.cat,
+        // labelText：节点标签文字（canvasNode 用固定每行 N 字换行绘制）。
+        // 禁用 G6 内置 label（label:false），避免其单行画出长名不换行。
+        label: false,
         labelText: n.cat === "bus" || n.cat === "cableTerminal" || n.cat === "consumer" ? "" : n.shortName || "",
         rotate: layout.stationRotate && layout.stationRotate.get(n.id) || 0,
         highlight: 0,
@@ -28035,21 +28273,56 @@ function setNodePalette(themeName) {
     if (key in C2) C2[key] = t[key];
   }
 }
+function nodeColor(attributes) {
+  return attributes && attributes.color || null;
+}
+function cellColorAt(attributes, i) {
+  const arr = attributes && attributes._cellColors;
+  return Array.isArray(arr) ? arr[i] || null : null;
+}
+function localPalette(attributes) {
+  const c = nodeColor(attributes);
+  if (!c) return C2;
+  return {
+    ...C2,
+    red: c,
+    orange: c,
+    cyan: c,
+    gold: c,
+    trunkLine: c,
+    dotFill: withAlpha(c, 0.18)
+  };
+}
+function withAlpha(color2, a2) {
+  if (typeof color2 !== "string") return color2;
+  const m = color2.match(/^#([0-9a-f]{6}|[0-9a-f]{3})$/i);
+  if (!m) return color2;
+  let hex2 = m[1];
+  if (hex2.length === 3) hex2 = hex2.split("").map((h) => h + h).join("");
+  const n = parseInt(hex2, 16);
+  const r = n >> 16 & 255, g = n >> 8 & 255, b = n & 255;
+  return `rgba(${r},${g},${b},${a2})`;
+}
+const LW = 1.8;
+const LW_HI = 2.2;
 function drawHighlight(attributes, group) {
   if (!attributes.highlight) return;
   const [w, h] = attributes.size;
+  const color2 = attributes.highlightColor || C2.gold;
+  const lw = attributes.highlightWidth || 2;
+  const dash = attributes.highlightDash || [5, 4];
   group.appendChild(
     new Rect({
       style: {
-        x: -w / 2 + 1,
-        y: -h / 2 + 1,
-        width: w - 2,
-        height: h - 2,
-        radius: 4,
+        x: -w / 2 - 3,
+        y: -h / 2 - 3,
+        width: w + 6,
+        height: h + 6,
+        radius: 6,
         fill: "none",
-        stroke: C2.gold,
-        lineWidth: 1.6,
-        lineDash: [4, 3]
+        stroke: color2,
+        lineWidth: lw,
+        lineDash: dash
       }
     })
   );
@@ -28061,15 +28334,16 @@ function drawAnnotation(attributes, group) {
   const pos = attributes.annotationPos || "top";
   const offset = attributes.annotationOffset || 4;
   const y = pos === "top" ? -h / 2 - offset - 6 : h / 2 + offset + 6;
-  _drawWrappedText(group, label, 0, y, attributes.annotationSize || 12, attributes.annotationColor || C2.white, w + 10, 1.25);
+  _drawWrappedText(group, label, 0, y, attributes.annotationSize || 12, attributes.annotationColor || C2.white, w + 10, 1.25, 600);
 }
 function drawLabelUnder(attributes, group) {
   const label = attributes.labelText || "";
   if (!label) return;
   const [w, h] = attributes.size;
-  _drawWrappedText(group, label, 0, h / 2 + 8, 11, C2.white, w + 4, 1.3);
+  const x0 = w / 2 + 6;
+  _drawWrappedTextFixed(group, label, x0, -h / 2, 8, C2.white, 4, 1.3, 500, "left");
 }
-function text(attributes, group, str2, x, y, size, fill) {
+function text(attributes, group, str2, x, y, size, fill, weight = 400) {
   if (!str2) return;
   group.appendChild(
     new Text({
@@ -28079,6 +28353,7 @@ function text(attributes, group, str2, x, y, size, fill) {
         y,
         fontSize: size,
         fill,
+        fontWeight: weight,
         fontFamily: FONT,
         textAlign: "center",
         textBaseline: "middle"
@@ -28109,7 +28384,44 @@ function _wrapLines(str2, fontSize2, maxWidth) {
   if (line) lines.push(line);
   return lines;
 }
-function _drawWrappedText(group, str2, x, y, fontSize2, fill, maxWidth, lineGap = 1.3) {
+function _wrapLinesFixed(str2, chars2) {
+  if (!str2) return [];
+  const lines = [];
+  let line = "";
+  for (const ch of str2) {
+    line += ch;
+    if (line.length >= chars2) {
+      lines.push(line);
+      line = "";
+    }
+  }
+  if (line) lines.push(line);
+  return lines;
+}
+function _drawWrappedTextFixed(group, str2, x, y, fontSize2, fill, chars2, lineGap = 1.3, weight = 400, align = "center") {
+  if (!str2) return;
+  const lines = _wrapLinesFixed(str2, chars2);
+  if (!lines.length) return;
+  const lineHeight2 = fontSize2 * lineGap;
+  for (let i = 0; i < lines.length; i++) {
+    group.appendChild(
+      new Text({
+        style: {
+          text: lines[i],
+          x,
+          y: y + lineHeight2 * i,
+          fontSize: fontSize2,
+          fill,
+          fontWeight: weight,
+          fontFamily: FONT,
+          textAlign: align === "left" ? "left" : "center",
+          textBaseline: "middle"
+        }
+      })
+    );
+  }
+}
+function _drawWrappedText(group, str2, x, y, fontSize2, fill, maxWidth, lineGap = 1.3, weight = 400) {
   if (!str2) return;
   const lines = _wrapLines(str2, fontSize2, maxWidth);
   if (!lines.length) return;
@@ -28124,6 +28436,7 @@ function _drawWrappedText(group, str2, x, y, fontSize2, fill, maxWidth, lineGap
           y: y - totalH / 2 + lineHeight2 * (i + 0.5),
           fontSize: fontSize2,
           fill,
+          fontWeight: weight,
           fontFamily: FONT,
           textAlign: "center",
           textBaseline: "middle"
@@ -28133,77 +28446,122 @@ function _drawWrappedText(group, str2, x, y, fontSize2, fill, maxWidth, lineGap
   }
 }
 function drawTransformer(attributes, group) {
-  const lw = 1.4;
-  group.appendChild(new Line({ style: { x1: -24, y1: 0, x2: -15, y2: 0, stroke: C2.trunkLine, lineWidth: lw } }));
-  group.appendChild(new Circle({ style: { cx: -5, cy: 0, r: 10, fill: C2.orange, stroke: C2.trunkLine, lineWidth: 1.2 } }));
-  group.appendChild(new Circle({ style: { cx: 10, cy: 0, r: 10, fill: "none", stroke: C2.red, lineWidth: 1.2 } }));
-  group.appendChild(new Line({ style: { x1: 20, y1: 0, x2: 29, y2: 0, stroke: C2.red, lineWidth: lw } }));
+  const P = localPalette(attributes);
+  const lw = LW;
+  group.appendChild(new Line({ style: { x1: -26, y1: 0, x2: -14, y2: 0, stroke: P.trunkLine, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Circle({ style: { cx: -4.5, cy: 0, r: 10, fill: P.orange, stroke: P.trunkLine, lineWidth: 1.4 } }));
+  group.appendChild(new Circle({ style: { cx: -7.2, cy: -3.2, r: 3.2, fill: withAlpha(C2.white, 0.25), stroke: "none" } }));
+  group.appendChild(new Circle({ style: { cx: 10, cy: 0, r: 10, fill: withAlpha(P.red, 0.06), stroke: P.red, lineWidth: LW_HI } }));
+  group.appendChild(new Line({ style: { x1: 20, y1: 0, x2: 30, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
 }
 function drawFuse(attributes, group) {
-  const lw = 1.4;
-  group.appendChild(new Line({ style: { x1: -26, y1: 0, x2: -19, y2: 0, stroke: C2.red, lineWidth: lw } }));
-  group.appendChild(new Rect({ style: { x: -19, y: -7, width: 38, height: 14, radius: 1, fill: "none", stroke: C2.red, lineWidth: lw } }));
-  group.appendChild(new Circle({ style: { cx: -13, cy: 0, r: 3.6, fill: C2.red } }));
-  group.appendChild(new Rect({ style: { x: -8, y: -2.4, width: 5, height: 4.8, fill: C2.red } }));
-  group.appendChild(new Rect({ style: { x: -1, y: -5.4, width: 13, height: 10.8, fill: C2.red } }));
-  group.appendChild(new Line({ style: { x1: 19, y1: 0, x2: 26, y2: 0, stroke: C2.red, lineWidth: lw } }));
+  const P = localPalette(attributes);
+  const lw = LW;
+  group.appendChild(new Line({ style: { x1: -28, y1: 0, x2: -19, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Line({ style: { x1: 19, y1: 0, x2: 28, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Rect({ style: { x: -19, y: -7.5, width: 38, height: 15, radius: 2, fill: withAlpha(P.red, 0.05), stroke: P.red, lineWidth: lw } }));
+  group.appendChild(new Circle({ style: { cx: -13, cy: 0, r: 3.4, fill: P.red, stroke: "none" } }));
+  group.appendChild(new Rect({ style: { x: -8.2, y: -2.4, width: 5, height: 4.8, radius: 0.6, fill: P.red } }));
+  group.appendChild(new Rect({ style: { x: -1.4, y: -5.4, width: 13, height: 10.8, radius: 0.8, fill: P.red } }));
+  group.appendChild(new Rect({ style: { x: 5, y: -1.2, width: 8, height: 2.4, fill: C2.white, opacity: 0.55 } }));
 }
 function drawBreaker(attributes, group) {
-  const lw = 1.4;
-  group.appendChild(new Line({ style: { x1: -28, y1: 0, x2: -21, y2: 0, stroke: C2.red, lineWidth: lw } }));
-  group.appendChild(new Rect({ style: { x: -21, y: -9, width: 42, height: 18, radius: 2, fill: "none", stroke: C2.red, lineWidth: lw } }));
-  group.appendChild(new Rect({ style: { x: -21, y: -9, width: 42, height: 7, fill: "rgba(255,0,0,0.25)" } }));
-  _drawWrappedText(group, attributes.labelText, 0, 0.5, 10, C2.white, 36, 1.2);
-  group.appendChild(new Line({ style: { x1: 21, y1: 0, x2: 28, y2: 0, stroke: C2.red, lineWidth: lw } }));
+  const P = localPalette(attributes);
+  const lw = LW;
+  const [nw] = attributes.size;
+  const bw = 42;
+  const bh = 20, r = 4;
+  const bx = -bw / 2, by = -bh / 2;
+  const xEdge = (nw || 60) / 2;
+  const xBox = bw / 2;
+  if (xEdge > xBox) {
+    group.appendChild(new Line({ style: { x1: -xEdge, y1: 0, x2: -xBox, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+    group.appendChild(new Line({ style: { x1: xBox, y1: 0, x2: xEdge, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  }
+  group.appendChild(new Rect({ style: { x: bx, y: by, width: bw, height: bh, radius: r, fill: P.red, stroke: withAlpha(C2.white, 0.22), lineWidth: 1 } }));
+  if (attributes.labelText) {
+    _drawWrappedText(group, attributes.labelText, 0, 0.6, 11.5, "#FFFFFF", bw - 8, 1.15, 700);
+  }
 }
 function drawCableTerminal(attributes, group) {
-  group.appendChild(new Polygon({ style: { points: [[1, -8], [-7, 8], [9, 8]], fill: C2.red, stroke: C2.red, lineWidth: 1 } }));
+  const P = localPalette(attributes);
+  const lw = 1.6;
+  group.appendChild(new Line({ style: { x1: -11, y1: 0, x2: -5.5, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Polygon({
+    style: {
+      points: [[-5, -9.5], [11, 0], [-5, 9.5]],
+      fill: P.red,
+      stroke: withAlpha(C2.white, 0.3),
+      lineWidth: 1
+    }
+  }));
 }
 function drawStationTerminal(attributes, group) {
-  group.appendChild(new Line({ style: { x1: -9, y1: 0, x2: -1, y2: 0, stroke: C2.red, lineWidth: 1.4 } }));
-  group.appendChild(new Polygon({ style: { points: [[0, -5], [0, 5], [9, 0]], fill: "none", stroke: C2.red, lineWidth: 1.4 } }));
+  const P = localPalette(attributes);
+  const lw = LW;
+  group.appendChild(new Line({ style: { x1: -12, y1: 0, x2: -4, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Polygon({
+    style: {
+      points: [[0, -6], [0, 6], [10, 0]],
+      fill: withAlpha(P.red, 0.08),
+      stroke: P.red,
+      lineWidth: lw
+    }
+  }));
+}
+function drawMeterFace(group, cx, cy, meterW, meterH, lineColor, markCell, cellIdx) {
+  const r = Math.max(2, meterW * 0.16);
+  const body = new Rect({ style: { x: cx - meterW / 2, y: cy - meterH / 2, width: meterW, height: meterH, radius: r, fill: withAlpha(lineColor, 0.06), stroke: lineColor, lineWidth: 1.2, cursor: "pointer" } });
+  if (markCell) markCell(body, cellIdx);
+  group.appendChild(body);
+  const winW = meterW * 0.66, winH = Math.max(2.4, meterH * 0.17);
+  const win = new Rect({ style: { x: cx - winW / 2, y: cy - meterH * 0.31, width: winW, height: winH, radius: winH / 2, fill: lineColor, opacity: 0.5, stroke: "none" } });
+  if (markCell) markCell(win, cellIdx);
+  group.appendChild(win);
+  const dot2 = new Circle({ style: { cx, cy: cy + meterH * 0.12, r: 1.6, fill: lineColor, opacity: 0.85, stroke: "none" } });
+  if (markCell) markCell(dot2, cellIdx);
+  group.appendChild(dot2);
 }
 function drawMeterBox(attributes, group) {
   const [w, h] = attributes.size;
+  const boxColor = nodeColor(attributes);
   if (attributes._meterBoxMode === "single") {
     const nodeId = attributes._nodeId || "";
     const sel = attributes._custSel === 0;
     const hover = attributes._custHover === 0;
-    const lineColor = sel ? C2.gold : hover ? C2.cyan : C2.white;
+    const baseColor = cellColorAt(attributes, 0) || boxColor || C2.white;
+    const lineColor = sel ? C2.gold : hover ? C2.cyan : baseColor;
     const markCell = (shape) => {
       if (!nodeId) return;
       shape.__custBox = nodeId;
       shape.__custIndex = 0;
     };
+    const meterW = 20;
+    const meterH = 26;
+    drawMeterFace(group, 0, -1, meterW, meterH, lineColor, markCell, 0);
     if (sel || hover) {
-      const ring = new Circle({
+      const ring = new Rect({
         style: {
-          cx: 0,
-          cy: -3,
-          r: 13,
-          fill: sel ? C2.gold : C2.cyan,
-          fillOpacity: sel ? 0.3 : 0.18,
+          x: -meterW / 2 - 4,
+          y: -meterH / 2 - 4,
+          width: meterW + 8,
+          height: meterH + 8,
+          radius: 5,
+          fill: "none",
           stroke: sel ? C2.gold : C2.cyan,
-          lineWidth: sel ? 1.6 : 1.1
+          lineWidth: sel ? 2 : 1.3
         }
       });
       markCell(ring);
       group.appendChild(ring);
     }
-    const meterCircle = new Circle({ style: { cx: 0, cy: -3, r: 11, fill: "none", stroke: lineColor, lineWidth: sel ? 1.8 : 1.6, cursor: "pointer" } });
-    markCell(meterCircle);
-    group.appendChild(meterCircle);
-    const stub = new Line({ style: { x1: 0, y1: -14, x2: 0, y2: -7, stroke: lineColor, lineWidth: 1.6, cursor: "pointer" } });
-    markCell(stub);
-    group.appendChild(stub);
     const name = attributes._customers && attributes._customers[0] ? attributes._customers[0].realConsName || attributes._customers[0].consName || "" : "";
     if (name) {
-      const nameText = new Text({ style: { text: name, x: 0, y: 12, fontSize: 8, fill: sel ? C2.gold : hover ? C2.cyan : C2.white, fontFamily: FONT, textAlign: "center", textBaseline: "middle", cursor: "pointer" } });
-      markCell(nameText);
-      group.appendChild(nameText);
+      _drawWrappedTextFixed(group, name, 0, meterH / 2 + 7, 7, lineColor, 4, 1.15, 500);
     }
   } else if (attributes._meterBoxMode === "grid" && attributes._customers) {
-    group.appendChild(new Rect({ style: { x: -w / 2, y: -h / 2, width: w, height: h, fill: C2.meterFill, stroke: C2.meterText, lineWidth: 0.9, radius: 2 } }));
+    const frameColor = boxColor || C2.meterText;
+    group.appendChild(new Rect({ style: { x: -w / 2, y: -h / 2, width: w, height: h, fill: withAlpha(frameColor, 0.04), stroke: frameColor, lineWidth: 1, radius: 4 } }));
     const cols = attributes._meterBoxCols || 5;
     const customers = attributes._customers;
     const showName = attributes._meterBoxShowName;
@@ -28214,11 +28572,12 @@ function drawMeterBox(attributes, group) {
     const gridH = rows * cellH + (rows - 1) * METER_GAP;
     const startX = -gridW / 2;
     const startY = -gridH / 2;
-    const meterR = 9;
+    const meterW = Math.min(13, cellW * 0.5);
+    const meterH = meterW * 1.5;
+    const hitR = Math.max(9, meterH * 0.4);
     const custSel = attributes._custSel == null ? -1 : attributes._custSel;
     const custHover = attributes._custHover == null ? -1 : attributes._custHover;
     const nodeId = attributes._nodeId || "";
-    const hitR = meterR + 2.5;
     const markCell = (shape, i) => {
       if (!nodeId) return;
       shape.__custBox = nodeId;
@@ -28231,7 +28590,8 @@ function drawMeterBox(attributes, group) {
       const cy = startY + row2 * (cellH + METER_GAP) + cellW / 2;
       const sel = i === custSel;
       const hover = i === custHover;
-      const lineColor = sel ? C2.gold : hover ? C2.cyan : C2.meterText;
+      const baseColor = cellColorAt(attributes, i) || C2.meterText;
+      const lineColor = sel ? C2.gold : hover ? C2.cyan : baseColor;
       if (sel || hover) {
         group.appendChild(new Circle({
           style: {
@@ -28241,49 +28601,69 @@ function drawMeterBox(attributes, group) {
             fill: sel ? C2.gold : C2.cyan,
             fillOpacity: sel ? 0.3 : 0.18,
             stroke: sel ? C2.gold : C2.cyan,
-            lineWidth: sel ? 1.6 : 1.1
+            lineWidth: sel ? 1.7 : 1.1
           }
         }));
       }
-      group.appendChild(new Circle({ style: { cx, cy, r: meterR, fill: "none", stroke: lineColor, lineWidth: sel ? 1.2 : 0.8 } }));
-      group.appendChild(new Line({ style: { x1: cx, y1: cy - meterR, x2: cx, y2: cy - meterR + 4, stroke: lineColor, lineWidth: 0.8 } }));
+      drawMeterFace(group, cx, cy, meterW, meterH, lineColor, markCell, i);
       const hit = new Circle({ style: { cx, cy, r: hitR, fill: "rgba(255,255,255,0.01)", stroke: "none", cursor: "pointer" } });
       markCell(hit, i);
       group.appendChild(hit);
       if (showName) {
         const name = customers[i].realConsName || customers[i].consName || "";
         if (name) {
-          const nameText = new Text({ style: { text: name, x: cx, y: cy + meterR + 6, fontSize: 7, fill: sel ? C2.gold : hover ? C2.cyan : C2.meterText, fontFamily: FONT, textAlign: "center", textBaseline: "middle", cursor: "pointer" } });
-          markCell(nameText, i);
-          group.appendChild(nameText);
+          _drawWrappedTextFixed(group, name, cx, cy + meterH / 2 + 6.5, 6.5, lineColor, 4, 1.15, 500);
+          const hitName = new Circle({
+            style: {
+              cx,
+              cy: cy + meterH / 2 + 6.5 + 4,
+              r: Math.max(8, Math.min(14, Math.ceil(name.length / 4) * 4 + 4)),
+              fill: "rgba(255,255,255,0.01)",
+              stroke: "none",
+              cursor: "pointer"
+            }
+          });
+          markCell(hitName, i);
+          group.appendChild(hitName);
         }
       }
     }
   } else {
-    group.appendChild(new Rect({ style: { x: -9.5, y: -9.5, width: 19, height: 19, fill: C2.meterFill, stroke: C2.meterText, lineWidth: 0.9 } }));
-    text(attributes, group, "JX", 0, 0.5, 7.5, C2.meterText);
+    const s2 = Math.min(w, h) || 21;
+    const ink = boxColor || C2.meterText;
+    group.appendChild(new Rect({ style: { x: -s2 / 2, y: -s2 / 2, width: s2, height: s2, radius: Math.max(2, s2 * 0.16), fill: C2.meterFill, stroke: ink, lineWidth: 1.4 } }));
+    group.appendChild(new Rect({ style: { x: -s2 / 2 + 2, y: -s2 / 2 + 2, width: s2 - 4, height: 2, radius: 1, fill: withAlpha(ink, 0.35), stroke: "none" } }));
+    text(attributes, group, "JX", 0, s2 * 0.06, Math.max(8, s2 * 0.4), ink, 700);
   }
 }
 function drawConsumer(attributes, group) {
-  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 12.5, fill: "none", stroke: C2.white, lineWidth: 1.8 } }));
-  text(attributes, group, "J", 0, 0.5, 13, C2.white);
+  const ink = nodeColor(attributes) || C2.white;
+  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 13, fill: "none", stroke: ink, lineWidth: LW_HI } }));
+  text(attributes, group, "J", 0, 0.8, 14.5, ink, 700);
 }
 function drawBus(attributes, group) {
   const [w] = attributes.size;
-  group.appendChild(new Rect({ style: { x: -w / 2, y: -3, width: w, height: 6, radius: 2, fill: C2.busFill, stroke: C2.white, lineWidth: 1.4 } }));
+  const ink = nodeColor(attributes) || C2.white;
+  const hh = Math.max(4.5, Math.min(6, w / 10));
+  group.appendChild(new Rect({ style: { x: -w / 2, y: -hh / 2, width: w, height: hh, radius: hh / 2, fill: withAlpha(ink, 0.5), stroke: ink, lineWidth: 1.2 } }));
+  group.appendChild(new Rect({ style: { x: -w / 2 + 1, y: -0.7, width: w - 2, height: 1.4, fill: withAlpha(C2.canvasBg || "#000", 0.18), stroke: "none" } }));
 }
 function drawLineDot(attributes, group) {
-  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 4, fill: C2.dotFill, stroke: C2.cyan, lineWidth: 1.4 } }));
+  const P = localPalette(attributes);
+  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 4.6, fill: P.dotFill, stroke: P.cyan, lineWidth: 1.6 } }));
+  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 1.5, fill: P.cyan, stroke: "none" } }));
 }
 function drawJunction(attributes, group) {
-  const lw = 1.4;
-  group.appendChild(new Line({ style: { x1: -5, y1: 0, x2: 5, y2: 0, stroke: C2.red, lineWidth: lw } }));
-  group.appendChild(new Line({ style: { x1: 0, y1: -5, x2: 0, y2: 5, stroke: C2.red, lineWidth: lw } }));
-  group.appendChild(new Line({ style: { x1: -3.5, y1: -3.5, x2: 3.5, y2: 3.5, stroke: C2.red, lineWidth: lw } }));
-  group.appendChild(new Line({ style: { x1: 3.5, y1: -3.5, x2: -3.5, y2: 3.5, stroke: C2.red, lineWidth: lw } }));
+  const P = localPalette(attributes);
+  const lw = LW;
+  group.appendChild(new Line({ style: { x1: -5.5, y1: 0, x2: 5.5, y2: 0, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Line({ style: { x1: 0, y1: -5.5, x2: 0, y2: 5.5, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Line({ style: { x1: -3.9, y1: -3.9, x2: 3.9, y2: 3.9, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
+  group.appendChild(new Line({ style: { x1: 3.9, y1: -3.9, x2: -3.9, y2: 3.9, stroke: P.red, lineWidth: lw, lineCap: "round" } }));
 }
 function drawUnknown(attributes, group) {
-  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 8, fill: C2.unknownFill, stroke: C2.unknownStroke, lineWidth: 1.2 } }));
+  group.appendChild(new Circle({ style: { cx: 0, cy: 0, r: 9, fill: C2.unknownFill, stroke: C2.unknownStroke, lineWidth: 1.4 } }));
+  text(attributes, group, "?", 0, 0.8, 13, C2.unknownStroke, 700);
 }
 function drawStation(attributes, group) {
   const [w, h] = attributes.size;
@@ -28294,16 +28674,30 @@ function drawStation(attributes, group) {
         y: -h / 2,
         width: w,
         height: h,
-        radius: 2,
+        radius: 5,
         fill: C2.stationFill,
         stroke: C2.white,
-        lineWidth: 1.2,
+        lineWidth: 1.5,
+        opacity: 0.95
+      }
+    })
+  );
+  group.appendChild(
+    new Rect({
+      style: {
+        x: -w / 2 + 2,
+        y: -h / 2 + 2,
+        width: w - 4,
+        height: 2.4,
+        radius: 1.2,
+        fill: withAlpha(C2.white, 0.28),
+        stroke: "none",
         opacity: 0.9
       }
     })
   );
   if (attributes._stationTitle) {
-    _drawWrappedText(group, attributes._stationTitle, 0, -h / 2 + 13, 11, C2.stationText, w - 12, 1.35);
+    _drawWrappedText(group, attributes._stationTitle, 0, -h / 2 + 15, 12, C2.stationText, w - 12, 1.35, 600);
   }
 }
 const DRAWERS = {
@@ -28320,7 +28714,6 @@ const DRAWERS = {
   station: drawStation,
   other: drawUnknown
 };
-const LABEL_UNDER = /* @__PURE__ */ new Set(["transformer", "fuse"]);
 const _pulseState = /* @__PURE__ */ new Map();
 class SvgSymbolNode extends BaseNode {
   drawKeyShape(attributes, container) {
@@ -28354,7 +28747,9 @@ class SvgSymbolNode extends BaseNode {
     draw(attributes, target);
     drawHighlight(attributes, target);
     drawAnnotation(attributes, target);
-    if (LABEL_UNDER.has(attributes.cat)) drawLabelUnder(attributes, target);
+    if (attributes.labelText && !attributes._stationTitle && attributes.cat !== "bus" && attributes.cat !== "cableTerminal" && attributes.cat !== "consumer" && attributes.cat !== "switch" && attributes.cat !== "meterBox") {
+      drawLabelUnder(attributes, target);
+    }
     const pulse = _pulseState.get(attributes._nodeId || "");
     if (pulse) {
       const items = rot ? [target] : key.children || [];
@@ -29267,7 +29662,7 @@ const _sfc_main = {
   }
 };
 const DistanceTop10 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-438b6017"]]);
-const VERSION = "0.1.7";
+const VERSION = "0.1.8";
 const DESCRIPTION = "配电台区单线图拓扑成图引擎";
 export {
   DESCRIPTION,