Dashing是什么Shopify开源实时数据仪表盘框架10分钟打造一块惊艳大屏【免费下载链接】dashingThe exceptionally handsome dashboard framework in Ruby and Coffeescript.项目地址: https://gitcode.com/gh_mirrors/da/dashing什么是 DashingDashing是 Shopify 开源的一个实时数据仪表盘框架基于 RubySinatra CoffeeScript 构建官方 slogan 是史上最帅气的仪表盘框架。它的定位非常明确帮你快速搭建一块漂亮的数据大屏而且在电视大屏上效果尤其惊艳。想象这样的场景会议室电视上挂着一块屏幕实时跳动的销售额、滚动更新的评论流、不断变化的曲线图——这就是 Dashing 的典型使用场景。 小提示Dashing 项目已不再主动维护社区有活跃的 fork 持续更新本文基于该仓库的经典版本讲解核心用法通用。三大核心特性为什么说它惊艳特性说明⚡ 真·实时后端每 2 秒或任意频率推送数据浏览器通过 SSEServer-Sent Events即时刷新无需轮询 10 个内置组件时钟、仪表、数字、列表、图表、图片、文本、评论、iframe开箱即用 拖拽布局浏览器里直接拖动组件调整位置开发模式下可一键保存布局代码数据推送的核心逻辑在 lib/dashing/app.rb 中/events接口保持长连接job 每调用一次send_event所有打开的仪表盘页面就会同步刷新。10分钟上手从零搭建你的第一块大屏第一步准备环境安装 Ruby2.x 系列和 RubyGems然后安装 Dashing 命令行工具gem install dashing第二步一键创建项目Dashing 的命令行工具定义在 lib/dashing/cli.rb提供了全套脚手架能力dashing new my_dashboard这条命令会从 templates/project/ 模板生成一个完整项目包括示例仪表盘、4 个示例 job 和 10 个内置 widget。第三步启动并查看大屏进入项目目录执行bundle install dashing start打开浏览器访问http://localhost:3030恭喜——你已经拥有一块会自己动的大屏了架构解析Widget、Dashboard、Job 三层设计理解 Dashing 只需记住三层结构这也是它上手快的关键1️⃣ Widget组件—— 长什么样每个 widget 由三个文件组成例如数字组件 number.html、number.coffee、number.scss。HTML 定义结构CoffeeScript 监听事件并更新内容SCSS 负责样式。2️⃣ Dashboard仪表盘—— 怎么摆放一个.erb文件就是一块大屏的布局例如示例仪表盘 sample.erb。用data-sizex/data-sizey控制组件占几格data-id决定它接收哪个数据流li>SCHEDULER.every 2s do send_event(valuation, { current: rand(100) }) send_event(synergy, { value: rand(100) }) end改一个数字、换个数据源大屏内容立刻变化——这就是 Dashing 的实时魅力。内置 10 种 Widget 组件速览组件用途适合场景Number大数字 涨跌颜色KPI 指标、计数Meter环形仪表百分比、进度Graph实时折线图D3.js趋势监控List滚动列表Top N 排名Comments带头像的评论流社交媒体动态Clock时钟大屏氛围Image / Text / Iframe图片 / 文本 / 嵌入页面自由组合所有组件源码都在 templates/project/widgets/ 下照着 text 这类简单组件抄一遍就能做出你自己的定制组件。进阶玩法打造 1080p 电视大屏仓库里藏着一块隐藏关卡——sampletv.erb这是一块专为 1080p 电视优化的 5 列布局包含时钟、Logo、双仪表、Karma 数字、实时曲线和 Twitter 评论流。启动后访问http://localhost:3030/sampletv直接把页面投到会议室电视上就是一份完整的监控大屏方案。其他实用技巧外部推数据任何系统都可以用curl向/widgets/组件id发 POST 请求推数据页面底部有示例命令方便接入你的业务系统自定义 jobdashing generate job xxx生成新任务比如 twitter.rb 就展示了如何每 10 分钟拉一次社交媒体数据换肤样式集中在 application.scss改主题色只需几行 SCSS访问控制在config/settings.rb里设置set :auth_token即可开启令牌鉴权常见问题 FAQQDashing 适合什么场景A运营数据大屏、DevOps 监控墙、直播间数据面板、发布会实时演示……凡是需要把数据挂在电视/投影上的场景。Q和 Grafana 这类监控工具比有何不同AGrafana 是专业监控平台Dashing 更轻量、更好看强在快速定制和大屏展示适合做对外展示的数据墙。Q如何停止服务A执行dashing stop即可同样基于 Thin 服务器管理。写在最后Dashing 用最朴素的三层设计组件 布局 任务把做一块实时大屏的门槛降到了 10 分钟dashing new创建项目、改一改 jobs/ 里的数据源、调一调 dashboards/ 的布局剩下交给 SSE 实时推送。如果你想在自己的团队里快速搭出一块既专业又抓眼球的数据大屏Dashing 值得放进你的工具箱。现在就打开终端敲下第一条命令试试吧【免费下载链接】dashingThe exceptionally handsome dashboard framework in Ruby and Coffeescript.项目地址: https://gitcode.com/gh_mirrors/da/dashing创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考