在Diagrams.net（原Draw.io）中实现基础数学求和功能可行吗？

Diagrams.net原生没有提供一键统计带特定参数形状的可视化功能，但可以通过自定义JavaScript脚本实现这类基础数学运算需求，包括统计符合条件的形状总数、数值求和等，这是官方支持的扩展方式。

具体实现步骤（以统计带Elec: T16参数的形状总数为例） #

• 给目标形状添加自定义参数
  右键目标形状 → 选择「编辑数据（Edit Data）」，在弹出的对话框中添加键值对：键设为Elec，值设为T16，完成后保存。重复此步骤给所有需要统计的形状添加该参数。

• 添加统计结果展示容器
  在画布上插入一个文本框，为了方便脚本识别，右键该文本框 → 编辑数据，添加键StatBox、值Count的自定义参数。

• 编写并运行自定义脚本

  1. 打开脚本编辑器：顶部菜单「扩展（Extras）」→「脚本（Script）」
  2. 输入以下代码，点击「运行（Run）」即可在文本框中看到统计结果：

  // 获取画布所有形状
  const shapes = diagram.getChildCells();
  let count = 0;
  const targetKey = "Elec";
  const targetValue = "T16";
  
  // 遍历筛选符合条件的形状
  shapes.forEach(shape => {
    const shapeData = shape.getData();
    if (shapeData && shapeData[targetKey] === targetValue) {
      count++;
    }
  });
  
  // 定位统计文本框
  const statBox = shapes.find(cell => {
    const boxData = cell.getData();
    return boxData && boxData["StatBox"] === "Count";
  });
  
  // 更新文本框内容
  if (statBox) {
    statBox.value = `T16 设备总数: ${count}`;
    diagram.setCell(statBox);
  }
  

• 可选：设置脚本快速触发
  脚本编辑完成后点击「保存（Save）」，命名为「统计T16设备数量」，之后可通过「扩展（Extras）」→「宏（Macros）」快速运行，也可设置快捷键实现一键更新。

扩展：实现数值求和 #

如果需要对形状的数值型参数求和，只需修改脚本的统计逻辑，例如将上述代码中的计数部分替换为累加：

// 假设形状带有数值参数"Power"，求和该参数
let totalPower = 0;
shapes.forEach(shape => {
  const shapeData = shape.getData();
  if (shapeData && shapeData[targetKey] === targetValue) {
    totalPower += parseFloat(shapeData["Power"]) || 0;
  }
});

// 更新文本框内容
if (statBox) {
  statBox.value = `T16 设备总功率: ${totalPower}W`;
  diagram.setCell(statBox);
}

内容的提问来源于stack exchange，提问作者Xavier Boeur