艺术装置：Johnny-Five控制的交互式LED矩阵墙-优快云博客

艺术装置：Johnny-Five控制的交互式LED矩阵墙

【免费下载链接】johnny-five JavaScript Robotics and IoT programming framework, developed at Bocoup. 项目地址: https://gitcode.com/gh_mirrors/jo/johnny-five

你是否想过用JavaScript创建引人入胜的艺术装置？本文将带你探索如何使用Johnny-Five框架构建一个交互式LED矩阵墙，让普通的LED矩阵变成能响应观众动作的动态艺术作品。读完本文，你将掌握LED矩阵的基本控制、多设备级联技术以及如何通过传感器实现交互效果。

项目概述

LED矩阵墙是将多个LED点阵模块组合成大型显示面板的艺术装置。本项目使用Johnny-Five框架控制HT16K33芯片驱动的8x8 LED矩阵，通过级联技术实现更大尺寸的显示效果，并结合PIR运动传感器实现观众互动。

核心组件：

8x8 LED矩阵模块（HT16K33驱动）
Arduino Uno开发板
PIR人体红外传感器
Johnny-Five JavaScript框架

项目源码结构：

LED矩阵控制逻辑：lib/led/matrix.js
示例代码：eg/led-matrix.js、eg/led-matrix-tutorial.js
官方文档：docs/led-matrix.md

硬件搭建

单个LED矩阵连接

首先需要正确连接LED矩阵到Arduino。以下是面包板接线图：

Fritzing diagram文件：docs/breadboard/led-matrix.fzz

接线说明：

VCC → 5V
GND → GND
SDA → A4 (I2C数据)
SCL → A5 (I2C时钟)

多矩阵级联

要构建更大的显示墙，需要级联多个LED矩阵。通过设置不同的I2C地址或使用多个驱动芯片，可以将多个矩阵组合起来。下面是双矩阵连接示意图：

Fritzing diagram文件：docs/breadboard/led-matrix-tutorial.fzz

增加互动传感器

为实现交互功能，添加PIR运动传感器：

VCC → 5V
GND → GND
OUT → Digital 2

软件实现

基础矩阵控制

使用Johnny-Five初始化单个LED矩阵非常简单：

var five = require("johnny-five");
var board = new five.Board();

board.on("ready", function() {
  var matrix = new five.Led.Matrix({
    controller: "HT16K33",
    rows: 8,
    cols: 8
  });

  // 显示一个心形图案
  var heart = [
    "01100110",
    "10011001",
    "10000001",
    "10000001",
    "01000010",
    "00100100",
    "00011000",
    "00000000"
  ];
  
  matrix.draw(heart);
});

运行示例：

node eg/led-matrix.js

多矩阵级联控制

通过指定devices参数实现多矩阵控制：

var display = new five.Led.Matrix({
  controller: "HT16K33",
  devices: 2 // 2个矩阵级联
});

// 在第一个矩阵显示文字
display.draw(0, "A");
// 在第二个矩阵显示图案
var pattern = [0, 102, 102, 102, 0, 129, 66, 60];
display.draw(1, pattern);

互动功能实现

结合PIR传感器实现运动检测和动态效果：

var five = require("johnny-five");
var board = new five.Board();

board.on("ready", function() {
  var matrix = new five.Led.Matrix({
    controller: "HT16K33"
  });
  var motion = new five.Motion(2); // PIR连接到数字2引脚
  
  // 初始显示
  matrix.draw("HI");
  
  // 检测到运动时
  motion.on("motionstart", function() {
    // 显示动画效果
    matrix.animate([
      "00000000",
      "01100110",
      "10011001",
      "10000001",
      "10000001",
      "01000010",
      "00100100",
      "00011000"
    ], 500); // 500ms切换一帧
  });
  
  // 运动结束时
  motion.on("motionend", function() {
    matrix.draw("BYE");
  });
});

创意扩展

文字滚动效果

实现长文本滚动显示：

function scrollText(text) {
  var index = 0;
  
  function next() {
    if (index < text.length) {
      matrix.draw(text[index]);
      index++;
      setTimeout(next, 500); // 每个字符显示500ms
    } else {
      index = 0;
      setTimeout(next, 500); // 循环显示
    }
  }
  
  next();
}

// 使用示例
scrollText("JOHNNY-FIVE ART WALL");

多传感器互动

可以添加更多传感器实现丰富互动：

声音传感器：docs/microphone.md
光线传感器：docs/light-ambient-TSL2561.md
距离传感器：docs/proximity-hcsr04.md

网络控制

结合Node.js的网络功能，可以实现远程控制和内容更新：

// 简单的HTTP服务器示例
var http = require('http');
var server = http.createServer(function(req, res) {
  // 解析URL参数设置显示内容
  var text = req.url.slice(1) || "ART";
  scrollText(text);
  res.end("Display updated to: " + text);
});
server.listen(3000);
console.log("Server running on port 3000");

部署与运行

环境准备

安装Arduino IDE并上传StandardFirmata固件
克隆项目仓库：

git clone https://gitcode.com/gh_mirrors/jo/johnny-five
cd johnny-five

安装依赖：

npm install

运行示例

# 基础矩阵示例
node eg/led-matrix.js

# 双矩阵示例
node eg/led-matrix-tutorial.js

总结与展望

本文介绍了如何使用Johnny-Five框架构建交互式LED矩阵墙艺术装置。通过I2C级联技术，可以轻松扩展显示尺寸；结合各种传感器，可以实现丰富的互动效果。这个项目展示了物联网技术与艺术创作的完美结合，为数字艺术提供了新的表达可能。

未来可以探索的方向：

结合AI算法实现图像识别和动态响应
使用WebSocket实现多用户实时互动
集成摄像头实现视频流显示：docs/led-matrix-HT16K33-16x8.md

希望这个教程能启发你创建自己的LED艺术装置！如有任何问题，欢迎查阅官方文档或提交issue参与讨论。

项目地址：https://gitcode.com/gh_mirrors/jo/johnny-five

【免费下载链接】johnny-five JavaScript Robotics and IoT programming framework, developed at Bocoup. 项目地址: https://gitcode.com/gh_mirrors/jo/johnny-five

创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考