ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

Johnny-Five 实战:用 Grove RGB LCD 构建随温度变色的温度显示器

Johnny-Five 实战:用 Grove RGB LCD 构建随温度变色的温度显示器 IoT机器人嵌入式【免费下载链接】johnny-fiveJavaScript Robotics and IoT programming framework, developed at Bocoup.项目地址https://gitcode.com/gh_mirrors/jo/johnny-five点击查看免费下载导读本文以 Johnny-Five 仓库中的官方示例 Grove RGB LCD 温度显示器文档 为主线讲解如何将 Grove 温度传感器NTC 热敏电阻与 Grove RGB LCD 背光显示屏JHD1313M1组合构建一个温度一变、屏幕背光颜色就变的 IoT 可视化装置。读完本文你将掌握 Johnny-Five 中ThermometerGROVE 控制器与LCDJHD1313M1 控制器的完整初始化与用法理解温度数据的内部换算原理、RGB 背光的 I2C 控制机制以及基于线性插值实现颜色渐变的实战技巧。项目概览温度读数如何翻译成颜色这是一个典型的传感器输入 → 数据加工 → 输出设备反馈的物联网闭环示例输入Grove 温度传感器插在 Grove Base Shield 的 A0 模拟口持续输出环境温度加工Johnny-Five 的Thermometer组件把原始 ADC 值换算成摄氏度/华氏度并在data事件中把当前华氏温度交给回调映射程序通过线性插值函数把华氏温度0100°F 区间映射为红、绿、蓝三个 0255 的字节值输出LCD组件的bgColor()方法把颜色写入 JHD1313M1 的 RGB 背光芯片print()方法在屏幕上显示当前华氏温度值。因此屏幕背光的颜色就是当前温度的可视化仪表盘温度越高越偏红越低越偏蓝。硬件清单与接线根据示例文档运行本程序需要以下硬件一块支持 Firmata 的板子示例文档基于Intel Edison Arduino Breakout编写实际任意支持 Firmata 的板子如 Arduino Uno均可直接运行Grove Base Shield v2用于把 Grove 模块的信号引到板子的模拟口与 I2C 总线Grove - RGB LCD w/ Backlight即 JHD1313M1 控制器16×2 字符屏 RGB 背光Grove - Temperature SensorNTC 热敏电阻模块。接线方式非常简洁温度传感器模块 → Grove Shield 的A0模拟接口RGB LCD 模块 → Grove Shield 的任意I2C接口。仓库提供了该接线的 Fritzing 设计文件可下载后用 Fritzing 打开查看完整连线细节。运行示例安装 Johnny-Five 并接入板子后在仓库根目录下直接执行node eg/grove-lcd-rgb-temperature-display.js仓库内对应的完整示例源码位于 eg/grove-lcd-rgb-temperature-display.js。完整代码与逐段解析以下代码即该示例的完整实现与文档内容一致var five require(johnny-five); var board new five.Board(); board.on(ready, function() { // Plug the Thermometer sensor module // into the Grove Shields A0 jack var thermometer new five.Thermometer({ controller: GROVE, pin: A0 }); // Plug the LCD module into any of the // Grove Shields I2C jacks. var lcd new five.LCD({ controller: JHD1313M1 }); var f 0; thermometer.on(data, function() { // The LCDs background will change // color according to the temperature. // // Hot - Warm: Red - Yellow // Moderate: Green // Cool - Cold: Blue - Violet // // Experiment with sources of hot and // cold temperatures! // if (f Math.round(this.fahrenheit)) { return; } f Math.round(this.fahrenheit); var r linear(0x00, 0xFF, f, 100); var g linear(0x00, 0x00, f, 100); var b linear(0xFF, 0x00, f, 100); // console.log(Fahrenheit: %d°, f); lcd.bgColor(r, g, b).cursor(0, 0).print(f); }); }); // Linear Interpolation function linear(start, end, step, steps) { return (end - start) * step / steps start; }1. 温度传感器初始化var thermometer new five.Thermometer({ controller: GROVE, pin: A0 });controller: GROVE告诉 Johnny-Five 使用 Seeed Studio Grove 温度传感器对应的换算算法详见下文源码分析pin: A0指定模拟输入口。板子就绪ready事件后组件即开始周期性采样。2. RGB LCD 初始化var lcd new five.LCD({ controller: JHD1313M1 });JHD1313M1是 Grove RGB 背光 LCD 使用的控制器标识它走 I2C 总线因此不需要指定引脚。从 lib/lcd.js 的源码可以看到该控制器默认rows 2、cols 16、字符点阵dots 5x8并同时管理两个 I2C 从机地址LCD 本体0x3ERGB 背光芯片0x62均支持通过options.address覆盖。3. 温度事件监听与刷新节流if (f Math.round(this.fahrenheit)) { return; } f Math.round(this.fahrenheit);thermometer.on(data, ...)在每次采样时触发回调中的this即传感器实例。代码先用Math.round(this.fahrenheit)取整只有温度整数部分发生变化时才真正刷新 LCD——这样既避免了屏幕无意义地高频重绘也天然实现了温度稳定时背光稳定的效果。4. 温度 → RGB 的线性插值映射var r linear(0x00, 0xFF, f, 100); var g linear(0x00, 0x00, f, 100); var b linear(0xFF, 0x00, f, 100);linear(start, end, step, steps)是标准的线性插值函数function linear(start, end, step, steps) { return (end - start) * step / steps start; }其含义是把step当前值在0steps区间内的比例映射到startend区间。示例中以华氏 0100 为标尺100°F ≈ 37.8°C温度 f°FR 通道G 通道B 通道合成颜色000255蓝色501280128品红/紫色10025500红色值得注意代码中 G 通道的插值区间是(0x00, 0x00)即恒为 0。因此实际运行时背光呈现的是蓝 → 紫 → 红的渐变代码注释中描述的中等温度显示绿色Moderate: Green属于理想化的色彩标度设计意图与当前实现并不完全一致。如果你希望真正显示绿色可以把 G 通道改成类似linear(0x00, 0xFF, f, 100)的分段映射例如在 50°F 附近达到峰值。5. 链式刷新背光与文字lcd.bgColor(r, g, b).cursor(0, 0).print(f);这是 Johnny-Five 风格的方法链bgColor()设置背光颜色cursor(0, 0)把光标定位到第 0 行第 0 列print(f)在该位置输出华氏温度整数值。从源码看cursor(row, col)最终委托给setCursor(col, row)通过计算 DDRAM 地址第 0 行基址0x80、第 1 行基址0xc0完成定位见 lib/lcd.js 与 lib/lcd.js三个方法都返回实例本身因此可以流畅链式调用。源码纵深GROVE 温度传感器的换算原理在 lib/thermometer.js 中GROVE控制器定义了自己的toCelsius换算逻辑。Grove 温度传感器本质是一个 NTC 热敏电阻其内部实现const adcres 1023; // 10 位 ADC 分辨率 const beta 3975; // 热敏电阻 B 值Beta 参数 const rb 10000; // 10 kOhm 分压电阻 const tempr 298.15; // 参考温度 25°C换算为开尔文 const rthermistor (adcres - raw) * rb / raw; const tempc 1 / (Math.log(rthermistor / rb) / beta 1 / tempr) - 273.15;它先用 ADC 读数反推热敏电阻当前阻值再用 NTC 的 B 值方程Steinhart-Hart 的简化形式算出摄氏度。Thermometer基类随后在属性描述符中自动派生出三种温标lib/thermometer.jscelsius直接调用各控制器的toCelsius(raw)fahrenheitcelsius * 9 / 5 32保留两位小数kelvincelsius 273.15。同时每次采样都会触发data事件携带C/F/K字段只有摄氏度发生变化时才触发change事件默认采样频率freq为 25mslib/thermometer.js。示例代码监听data并取this.fahrenheit正是依赖这套换算链。源码纵深JHD1313M1 的双地址 I2C 架构JHD1313M1 是一块 16×2 字符 LCD其亮点是背光本身是一个独立的 RGB 控制器。Johnny-Five 在 lib/lcd.js 的JHD1313M1控制器中把这套架构封装得相当清晰LCD 主控地址0x3E负责字符显示。所有命令与数据通过i2cWrite(this.address.lcd, [mode, value])写入其中mode为0x80命令或0x40数据。初始化流程按照 HD44780 兼容规范执行上电后先sleep(50)等待电压稳定再重复发送功能设置命令、设置ENTRYLEFT输入模式、开显示、清屏、归位RGB 背光地址0x62负责颜色。bgColor(red, green, blue)依次向背光芯片写入寄存器0x04R、0x03G、0x02Blib/lcd.js三通道均为 0255 的字节值bgOn()/bgOff()则通过寄存器0x08控制背光总开关。颜色值在写入前会经过RGB.ToRGB()归一化lib/led/rgb.js因此bgColor的参数非常灵活既可以直接传三个数字如示例中的bgColor(r, g, b)也可以传[r, g, b]数组、{red, green, blue}对象、#ff0000十六进制字符串或rgb(...)字符串。如果你使用的是 Tessel 2仓库还提供了完全相同的 LCD 用法变体见 docs/lcd-rgb-tessel-grove-JHD1313M1.md 及示例 eg/lcd-rgb-tessel-grove-JHD1313M1.js。进阶思路让这个示例更好用改用摄氏度显示示例打印华氏度只需把插值标尺与显示值都换成this.celsius例如linear(0x00, 0xFF, Math.round(this.celsius), 40)即可让颜色渐变匹配 040°C 的日常室温区间还原绿色舒适区如前述将 G 通道改为分段线性如 0°F→0、50°F→255、100°F→0即可实现冷蓝 → 适中绿 → 热红的完整语义色标与文档注释中的设计意图一致减少刷新噪音Thermometer的change事件只在温度真正变化时触发天然适合替代data事件做显示刷新避免屏幕内容抖动换用其他温度传感器Johnny-Five 的Thermometer支持大量控制器如TMP36、LM35、DS18B20、SHT31D等见 lib/thermometer.js把controller与接线换成对应模块即可复用本示例的显示逻辑。常见问题排查屏幕亮但温度不变确认温度传感器确实插在 A0 口且controller: GROVE未被遗漏——若缺省控制器Johnny-Five 会退回通用ANALOG换算读数含义将完全不同背光不变色检查 LCD 是否插在 I2C 接口上JHD1313M1 的两个地址LCD0x3E、RGB0x62缺一不可若 I2C 总线扫描不到0x62说明背光芯片未上电或接线接触不良数值跳动频繁示例通过取整后比较做刷新节流若仍需降低采样开销可设置Thermometer的freq选项如freq: 100拉长采样间隔。本文完整示例与接线图均可在仓库中直接复现源码见 eg/grove-lcd-rgb-temperature-display.js接线图见 docs/breadboard/grove-lcd-rgb-temperature-display.png。如需在 Grove LCD 上做更多显示实验自定义字符、滚动等可继续阅读 docs/grove-lcd-rgb.md。赞分享IoT机器人嵌入式【免费下载链接】johnny-fiveJavaScript Robotics and IoT programming framework, developed at Bocoup.项目地址https://gitcode.com/gh_mirrors/jo/johnny-five点击查看免费下载相关推荐Johnny-Five 实战使用 JHD1313M1 驱动 Grove I2C RGB LCD 显示屏Johnny Five 实战使用 JHD1313M1 驱动 Grove I2C RGB LCD 显示屏 本文基于 Johnny Five 仓库中的官方示例 dIoT机器人嵌入式Johnny-Five 实战在 Intel Edison 上驱动 Grove RGB LCD 实现旋钮调色Johnny Five 实战在 Intel Edison 上驱动 Grove RGB LCD 实现旋钮调色 导读 本文以 Johnny Five 官方示例 dIoT机器人嵌入式Johnny-Five LCD I2C Runner 实战用 Grove RGB LCD 打造跑步动画与动态背景色Johnny Five LCD I2C Runner 实战用 Grove RGB LCD 打造跑步动画与动态背景色 本篇技术指南围绕 Johnny FiveIoT机器人嵌入式创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表