chladni

在浏览器里玩转声学物理,实时生成克拉尼沙画图案

开源 🏷️完全免费 🔧 仅开源项目,无在线服务,需自行部署 设计创意 🍴 复刻 14 🐛 待处理 1 👀 关注 3
访问官网 ↗ GitHub ↗
GitHub 星标 ★ 63
维护状态 低维护
是否开源 开源
定价模式 🏷️完全免费 开源项目,本地部署,完全免费。

项目预览

chladni 项目界面预览图
图片来源:项目官网

项目数据

分类设计创意
开发团队luciopaiva
定价模式🏷️完全免费
价格说明开源项目,本地部署,完全免费。
访问状态🔧 仅开源项目,无在线服务,需自行部署
是否开源是
主要语言JavaScript
技术栈/模型chladni,chladni-plates,generative-art,html5-canvas,particles,vanilla-javascript,visualization
GitHub 星标★ 63
上线时间2018-11-15 00:00:00
代码更新2020-03-09
仓库体积48 KB
本站数据更新2026-11-10
维护状态低维护
收录时间2026-08-09
浏览次数6

项目介绍

chladni 是一个用原生 JavaScript 实现的克拉尼图形模拟器。克拉尼图形是物理学中著名的声学振动现象:当金属板在不同频率下振动时,板上的细沙会形成各种对称的几何图案。该项目通过纯前端技术,在浏览器中实时模拟这一物理过程,无需任何外部依赖或后端服务。它解决了在网页端直观展示声学振动模式的需求,让用户可以通过交互式界面探索不同频率和振动模式下的图案变化。核心能力包括:基于克拉尼方程(Chladni's equation)的数学计算、Canvas 渲染、实时参数调节(如频率、振幅、网格密度等),以及流畅的动画效果。项目代码简洁,适合学习物理模拟和 Canvas 绘图,也可作为创意编程的灵感来源。

Star 增长趋势

本站每日记录该项目 GitHub 星标变化,观测越久曲线越完整

数据来源:GitHub API 逐日快照 · 收录于 2026-08-09 · 当前星标 ★ 63

核心亮点

  • 纯 JavaScript 实现,零依赖,代码轻量易读,适合学习物理模拟
  • 交互式参数调节,实时反馈图案变化,探索性强
  • 基于真实物理方程(克拉尼方程),科学性强,视觉效果惊艳

不足之处

  • 文档/社区待观察
  • 功能相对单一,仅支持基础参数调节,缺乏预设模式或导出功能

适用场景

  • 物理教学演示,直观展示声学振动与驻波
  • 创意编程与生成艺术,制作动态几何图案
  • 前端 Canvas 技术学习与实验

替代项目

chladni-webgl、ChladniPlateSimulator、WebChladni

上一篇:Touchdesigner-Art

下一篇:stamps

同类项目推荐

weir 开源

用 Lisp 代码生成复杂图案,探索生成式设计

(deprecated) A system for making generative systems

★ 640 2026-08-09
generative-art-in-go 开源

边看书边敲代码,用Go画出你的第一幅生成艺术

A companion source code repository to the book "Generative Art in Go"

★ 109 2026-08-09
Lightswind-UI-Library 开源

160+ 动效 React 组件,复制即用,AI 助手直接调用

The AI-native CLI-first React component library. 160+ animated, accessible, producti···

★ 1274 2026-11-01
Rainform 开源

把数据变成雨,用三维视觉感受信息流动

Rainform / 数据成雨 — an interactive WebGL rainfall data visualization built with T···

★ 147 2026-08-09
design-image-studio 开源

把模糊想法变成高质量设计图,一键生成可落地视觉方案

把模糊视觉需求直接变成可落地生成的高质量设计图

★ 106 2026-08-09
PEmbroider 开源

用代码把图形变成真实刺绣,一键输出机器可读格式

Embroidery Library for Processing

★ 615 2026-08-09
melta-ui 开源

让 Claude Code 和 Cursor 看懂组件,生成界面少返工

人間にも、AIにも、読めるデザインシステム — AI-Ready Design System for Claude Code &···

★ 202 2026-10-08
CreativeCodingExamples 开源

用代码画艺术,从示例秒变创意编程玩家

A collection of Creative Coding examples by me & other artists. We've used Jetpack C···

★ 101 2026-08-09