入门 - 数字孪生可视化

欢迎光临 本综合指南将帮助您快速入门 Power BI 的 Digital Twin 可视化功能，该功能具有高级导航、交互式图例、按比例边缘宽度、增强型工具提示、交叉筛选和钻透功能。

📋全面功能概览

🔍 增强导航 ✨

流畅的缩放和平移动画
专业的屏幕导航控制
带有视口指示器的实时最小地图
智能光标反馈（抓取/抓取）
为大型图表提供类似 CAD 的精度

🎨 交互式图例系统 ✨

根据实际节点颜色生成动态图例
单击图例项突出显示节点
适用于任何分类字段
交叉过滤集成
按类别显示节点数

按比例边缘宽度 ✨

边缘厚度与流动强度成比例
每节点规范化算法
即时识别瓶颈
通过格式窗格切换开/关
上下文流程可视化

增强的工具提示 ✨

灵活的 "Key：值 "节点工具提示
智能边缘工具提示回退系统
通过字段名支持多字段
自动生成标签
向后兼容设计

🔄 高级交叉过滤

使用表格进行双向筛选
单个节点/边突出显示
基于图例的类别筛选
支持多重选择
增强的数据模型与措施

🎯 Power BI 集成

符合 AppSource 标准的上下文菜单
丰富的钻孔功能
有组织的格式窗格控件
通过分组增强边缘控制
专业遴选管理

增强的数据设置和要求

⚠️ 重要： 所有数据必须放在一个表中，使用 UNION 结构，并适当处理 NULL，以获得最佳性能。

增强型数据模型结构

- 增强的数据结构具有所有新功能 ✨

选择 

    NodeId、 

    状态Running\nType：Machine\nTemperature: 85°C\nEfficiency: 92%' as NodeTooltip、

    运行 "作为图例颜色， - 用于交互式图例 ✨

    NULL 作为 EdgeId，NULL 作为 SourceId，NULL 作为 TargetId，NULL 作为 EdgeTooltip、

    效率作为节点值， - 用于交叉筛选

    NULL 作为边缘值

FROM NodesTable

联盟 所有

选择 

    NULL 作为 NodeId，NULL 作为 NodeTooltip，NULL 作为 LegendColor、

    EdgeId、SourceId、TargetId、

    '类型：MaterialFlow\nIntensity：智能工具提示 ✨

    NULL 作为 NodeValue、

    FlowIntensity 作为 EdgeValue - 交叉过滤 + 比例宽度 ✨

FROM EdgesTable

增强型数据角色参考

现场	类型	现状	说明	示例
SVG 内容	测量	✅ 需要	包含数字孪生图的 SVG 标记	...
节点 ID	类别	✅ 需要	每个节点的唯一标识符	M1001、B1201、T1101
节点工具提示	类别	✨ 增强	"键：值 "多行工具提示格式	状态：Running （运行中）nType：机器：92%
图例颜色（可选）	类别	✨ 新！	用于交互式图例生成的分类字段	运行, 维护, 离线
节点值	测量	🔄 增强型	交叉过滤节点的业务指标	85.4, 92.1, 79.8
边缘标识	类别	❌ 可选	每条边的唯一标识符	E1001, E1002
源标识	类别	❌ 可选	边的源节点	M1001
目标 ID	类别	❌ 可选	边的目标节点	M1002
边缘工具提示（可选）	类别	✨ 新！	带有智能回退系统的多字段工具提示	支持多个字段
边缘值	测量	🔄 增强型	交叉过滤的流量强度 + 比例宽度	85.0, 150.5, 89.1

⚙️ 综合配置指南

步骤 1：准备 SVG 内容

创建 SVG 测量： 确保您的 SVG 包含有效的标记，并具有唯一的 本我 属性
匹配 ID： NodeId 值必须与 SVG 元素匹配 本我 属性正是
清洁结构： 使用一致的尺寸，避免复杂的变换
中性色 使用中性的 SVG 颜色；让视觉控制着色
边缘就绪设计 设计边缘路径，使其能很好地与宽度比例缩放配合使用

SVG 内容 = 

"

  <rect id=’M1001′ x=’100′ y=’100′ width=’80’ height=’50’ fill=’#cccccc’/>

  <rect id=’M1002′ x=’220′ y=’100′ width=’80’ height=’50’ fill=’#cccccc’/>

  <line id=’E1001′ x1=’180′ y1=’125′ x2=’220′ y2=’125′ stroke=’#999999’/>

  <circle id=’T1101′ cx=’260′ cy=’460′ r=’30’ fill=’#aaaaaa’/>

"

步骤 2：配置 Basic Visual

添加视觉效果： 在报告中插入数字孪生图像
映射 SVG 内容： 将 SVG 措施拖到 "SVG 内容 "字段中
地图 NodeId： 将节点标识符拖到 "NodeId "字段中
测试基本功能： 验证节点是否可点击，悬停是否有效

步骤 3：启用增强功能 ✨

🎨 交互式图例设置

添加图例字段： 将分类字段拖动至 "图例颜色（可选）"
自动生成： 图例自动读取实际节点颜色
测试互动： 单击图例项突出显示节点
验证显示： 检查每个类别出现的节点数

增强的工具提示设置

节点工具提示 在节点工具提示字段中使用 "Key：在节点工具提示字段中使用 "Key: ValuenKey2: Value2 "格式
边缘工具提示 将多个字段拖动到 "边缘工具提示（可选）"中
测试内容： 将鼠标悬停在节点/边上可验证丰富的工具提示
验证标签： 确保字段名显示为工具提示标签

比例边沿宽度设置

添加流量数据： 将吞吐量/强度值映射到边缘值字段
添加边缘字段 包括 EdgeId、SourceId、TargetId 以实现可视化
启用功能： 格式 "窗格 > 边缘 > 常规 > 切换 "按比例宽度"。
测试规模： 根据数据值验证边缘厚度刻度

高级导航设置

启用控制： 格式窗格 > 导航 > 启用缩放控制
启用小地图： 切换大图导航的最小地图
测试导航： 鼠标滚轮缩放，单击-拖动平移
核实反馈： 检查平移操作过程中的光标变化

🔄 高级交叉过滤设置

添加测量字段： 包括 NodeValue 和 EdgeValue 测量值
创建表格： 使用相同数据添加表格视觉效果，以便过滤
测试表过滤： 单击表格行以突出显示元素
测试图例过滤： 点击图例项目进行类别筛选
测试视觉过滤： 点击节点/边，过滤其他视觉效果

✅ 配置完成： 现在你应该拥有一个完全交互式的数字孪生系统，它具有高级导航、交互式图例、成比例的边缘宽度、增强的工具提示和全面的交叉筛选功能。

高级功能使用指南

增强的导航和缩放功能 ✨

鼠标和触摸互动

鼠标滚轮： 以流畅的动画效果滚动放大/缩小
点击和拖动： 通过视觉光标反馈（抓取/抓取）进行左右平移
导航控制： 使用屏幕上的 +、- 和主页按钮
重置视图： 点击主页按钮，顺利返回原始视图
小地图导航 点击最小地图跳转到不同区域
视口跟踪 在最小视图中观察实时视口矩形

🎨 交互式图例系统 ✨

图例设置和使用

设置： 将任何分类字段拖动到 "图例颜色（可选）"中
色彩阅读： 图例自动读取渲染节点的实际颜色
点击筛选： 点击图例项，突出显示相应的节点
视觉反馈： 选定类别突出显示，其他类别变暗
交叉视觉： 图例点击可在其他视觉效果中触发过滤功能
重置： 再次点击同一图例项清除高亮显示

💡 专业提示： 非常适合状态监控、类别筛选，以及一目了然地了解节点颜色所代表的含义。

按比例边缘宽度 ✨

基于流程的可视化

数据映射： 将流量强度/吞吐量映射到边缘值字段
启用功能： 格式 "窗格 > 边缘 > 常规 > "比例宽度
视觉缩放 边缘厚度随数据值自动缩放
情境扩展： 每个节点正常化显示相对重要性
瓶颈 ID： 即时识别大流量连接
可视范围 最小厚度为 1px ，最大厚度为 8px

💡 商业价值： 用于操作仪表板，可立即发现数字孪生中的瓶颈和高吞吐量连接。

增强的工具提示系统 ✨

灵活的工具提示配置

节点工具提示 在节点工具提示字段中使用 "Key：在节点工具提示字段中使用 "Key: ValuenKey2: Value2 "格式
多线支持： 使用 \n 在工具提示内容中换行
边缘工具提示 将多个字段拖动到 "边缘工具提示（可选）"中
智能回退： 未指定自定义字段时自动提供基本信息
实地标签： 字段名称自动成为工具提示标签
丰富的内容： 支持业务环境和业务指标

🔄 高级交叉过滤

三向过滤系统

表格 ↔ 视觉： 点击表格行以突出显示节点/边
图例 ↔ 视觉： 点击图例项目以突出显示类别
视觉 ↔ 其他视觉： 点击节点/对边过滤图表/表格
多种选择： 按住 Ctrl 键并点击多个元素
清除选择： 点击空白处重置所有选择
视觉反馈： 高亮元素完全不透明，其他元素变暗

⚡ 高级边缘控制

有组织格式窗格

📁 边缘部分：

🎨 边缘颜色（子群）： 单独的边缘颜色和渐变控制
⚙️ General（分组）： 不透明度、渲染顺序和宽度比例

可用控制器：

启用边缘渐变： 节点间平滑的颜色过渡
比例宽度： 基于流量的厚度缩放
边缘不透明度： 透明度控制（0-100%）
在前景中显示边缘 分层控制

🎯钻孔设置

创建钻孔页面 设置专用详情页
添加筛选字段： 在钻取过滤器中包含节点 ID/Edge ID
测试导航： 右键单击节点/边，查看钻孔选项
空位菜单： 右键单击空白区域，获取标准 Power BI 菜单
核实背景： 确保正确传递已过滤的上下文

🔧 综合故障排除指南

增强导航问题 ✨

检查 "格式 "窗格 > 导航设置，查看缩放控制和最小地图可见性
确认导航控制和小地图有足够的视觉空间
测试平移操作时的光标反馈（应显示抓取/抓取情况）
确保缩放/平移时正确更新最小地图视口矩形
在不同尺寸的屏幕上测试响应行为

❌ 互动图例问题 ✨

验证分类字段被拖至 "图例颜色（可选）"。
检查节点是否有实际颜色（而非全部默认灰色）
确保分类数据包含有意义的干净数值
测试图例点击功能的高亮显示行为
确认图例定位不会妨碍主视觉内容

边缘宽度比例问题 ✨

在 "格式 "窗格 >"边缘">"常规 "中启用 "比例宽度 "切换开关
确保边缘值字段包含数值流量数据
检查 EdgeId、SourceId 和 TargetId 是否正确映射
验证边缘数据的数值变化是否有意义
测试厚度缩放在视觉上是否合适

增强的工具提示问题 ✨

使用 "Key：节点工具提示字段使用 "Key: ValuenKey2: Value2 "格式
对于边缘工具提示，将字段拖动到 "边缘工具提示（可选）"部分
测试未指定边缘工具提示字段时的智能回退
检查字段名是否在工具提示显示中显示为标签
确保多行内容显示时换行正确

❌ 交叉筛选不起作用

添加节点值和/或边缘值测量字段
确保测量值已填充（非空/空）
双向测试：表格 → 视觉和视觉 → 表格
独立测试基于图例的过滤功能
验证选区触发高光（不透明度变化）
先进行简单的单选测试

❌ 可视画面不显示

检查 SVG 内容测量是否返回有效的 SVG 标记
验证 NodeId 字段是否已映射并包含数据
确保 SVG 元素 ID 与 NodeId 值完全匹配
使用在线 SVG 验证器验证 SVG 语法

❌ 节点不互动

确认 NodeId 数据角色已填充
检查 SVG 元素是否有匹配的 id 属性
验证元素未被其他 SVG 元素隐藏
测试悬停效果以确认元素检测

❌ 边缘不显示

映射 EdgeId、SourceId 和 TargetId 数据角色
确保 SourceId/TargetId 值与现有 NodeId 值匹配
检查边缘不透明度设置（可能设置过低）
验证边缘渲染顺序（前景与背景）
先用对比度高的边缘颜色进行测试

🎉先进的最佳做法

增强型数据建模 ✨

为交互式图例选择有意义的分类字段
使用 "键：值 "格式
使用流量指标计算边缘宽度比例
确保在 UNION 结构中正确处理 NULL
使用实际数据量进行测试

性能与导航 ✨

利用最小地图进行大型图表导航
优化 SVG 复杂性，实现流畅缩放/平移
用实际流量数据测试比例宽度
利用增强功能监控内存使用情况
战略性地使用测量字段进行交叉筛选

用户体验 ✨

使用图例点击进行基于类别的筛选
将表格筛选与图例筛选相结合
设计有意义的工具提示内容
标准化缩放级别和导航模式
端到端测试所有交互工作流程

高级集成 ✨

使用比例宽度进行运行监测
将图例过滤与时间序列分析相结合
将流量数据与预测分析连接起来
创建综合多模式仪表板
使用共享过滤功能整合地理视觉效果

🚀 准备好开始了吗？ 这一全面的可视化工具可将静态图表转化为交互式数字孪生仪表盘，并提供专业导航、智能流程可视化、基于类别的过滤和丰富的上下文信息！