Home Assistant Mini Graph Card 完整安装与使用指南:轻松实现数据可视化
【免费下载链接】mini-graph-cardMinimalistic graph card for Home Assistant Lovelace UI项目地址: https://gitcode.com/gh_mirrors/mi/mini-graph-card
Home Assistant Mini Graph Card 是一款专为 Lovelace 界面设计的简洁且功能强大的图表卡片,能够将传感器数据以直观的图表形式展示,让您的智能家居数据一目了然。
🚀 快速安装方法
方法一:HACS安装(推荐)
HACS(Home Assistant Community Store)是最便捷的安装方式:
- 打开Home Assistant,进入HACS面板
- 点击"前端"分类,然后点击右下角的"浏览并下载存储库"按钮
- 搜索"Mini Graph Card"
- 点击"下载此存储库"
- 重启Home Assistant
方法二:手动安装
如果您没有使用HACS,可以手动安装:
- 从最新版本下载
mini-graph-card-bundle.js文件 - 将文件复制到您的
config/www目录 - 添加资源引用(详见下文)
方法三:命令行安装
对于熟悉命令行的用户:
cd config/www wget https://gitcode.com/gh_mirrors/mi/mini-graph-card/releases/download/v0.13.0/mini-graph-card-bundle.js📋 添加资源引用配置
YAML配置方式
如果您使用YAML配置Lovelace,请在configuration.yaml中添加:
resources: - url: /local/mini-graph-card-bundle.js?v=0.13.0 type: module图形界面配置
如果您使用图形编辑器:
- 确保在用户配置文件中启用了高级模式
- 导航到"配置" -> "Lovelace仪表盘" -> "资源"标签
- 点击橙色"+"图标
- 输入URL
/local/mini-graph-card-bundle.js并选择类型"JavaScript模块"
🎯 基础配置教程
单实体图表配置
最简单的配置示例,显示单个传感器的数据:
type: custom:mini-graph-card entities: - sensor.temperature多实体图表配置
同时显示多个传感器的数据:
type: custom:mini-graph-card name: 室内环境 icon: mdi:home entities: - entity: sensor.temperature name: 温度 - entity: sensor.humidity name: 湿度 - entity: sensor.pressure name: 气压⚙️ 核心配置选项详解
必需配置项
| 选项名 | 类型 | 说明 |
|---|---|---|
| type | string | 必须设置为custom:mini-graph-card |
| entities | list | 一个或多个传感器实体列表 |
常用可选配置项
| 选项名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| name | string | 无 | 自定义卡片名称 |
| icon | string | 无 | 设置自定义图标(使用MDI图标) |
| hours_to_show | integer | 24 | 显示多少小时的历史数据 |
| height | number | 150 | 设置图表高度 |
| line_width | number | 5 | 设置线条粗细 |
| line_color | string | accent-color | 设置线条颜色 |
显示控制选项
使用show选项来控制显示哪些UI元素:
type: custom:mini-graph-card entities: - sensor.temperature show: name: true icon: true state: true graph: line fill: true points: hover legend: true🎨 高级配置技巧
动态颜色阈值
根据数值范围动态改变线条颜色:
type: custom:mini-graph-card entities: - sensor.temperature show: labels: true color_thresholds: - value: 0 color: "#3498db" - value: 20 color: "#f39c12" - value: 25 color: "#e74c3c"柱状图配置
将折线图改为柱状图:
type: custom:mini-graph-card entities: - entity: sensor.energy_consumption name: 能耗 show: graph: bar双Y轴配置
为不同量级的数据设置双Y轴:
type: custom:mini-graph-card entities: - entity: sensor.temperature name: 温度 - entity: sensor.humidity name: 湿度 y_axis: secondary show: labels: true labels_secondary: true🔧 实用场景配置
温度监控
type: custom:mini-graph-card entities: - entity: sensor.living_room_temp name: 客厅 - entity: sensor.bedroom_temp name: 卧室 name: 室内温度监控 hours_to_show: 24 line_width: 3能耗统计
type: custom:mini-graph-card entities: - entity: sensor.daily_energy name: 日能耗 hours_to_show: 168 aggregate_func: max group_by: date show: graph: bar average: true设备状态监控
type: custom:mini-graph-card entities: - entity: binary_sensor.motion_detector name: 运动检测 hours_to_show: 12 points_per_hour: 60 state_map: - value: "off" label: 无活动 - value: "on" label: 检测到活动💡 常见问题解决
卡片不显示
- 检查资源引用是否正确添加
- 确认文件路径是否正确
- 重启Home Assistant服务
数据不更新
- 检查传感器实体是否正常工作
- 确认缓存设置
- 清除浏览器缓存
样式异常
- 检查配置语法是否正确
- 确认缩进格式
- 查看浏览器控制台错误信息
📈 最佳实践建议
- 合理设置时间范围:根据数据类型选择合适的
hours_to_show值 - 优化显示元素:根据需要显示/隐藏不必要的信息
- 使用合适的图表类型:折线图适合连续数据,柱状图适合分类数据
🎊 总结
Home Assistant Mini Graph Card 是一款功能强大且易于使用的数据可视化工具。通过本指南,您应该能够:
- 顺利完成安装配置
- 掌握基础使用方法
- 了解高级配置技巧
- 解决常见问题
开始使用Mini Graph Card,让您的智能家居数据变得更加直观和易于理解!
【免费下载链接】mini-graph-cardMinimalistic graph card for Home Assistant Lovelace UI项目地址: https://gitcode.com/gh_mirrors/mi/mini-graph-card
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考