Ray Optics:5 分钟在浏览器里搭出 2D 光线追迹场景(附本地部署步骤)
Ray Optics5 分钟在浏览器里搭出 2D 光线追迹场景附本地部署步骤【免费下载链接】ray-opticsA web app for creating and simulating 2D geometric optical scenes, with a gallery of (interactive) demos.项目地址: https://gitcode.com/gh_mirrors/ra/ray-optics想在物理课上现场演示透镜成像或在一台笔记本上验证光学系统的光路打开浏览器里的 Ray Optics 即可——它是一个免费开源的 2D 几何光学仿真工具。教师、学生和光学工程师都可以用拖拽界面搭建场景无需安装任何软件。它是什么 / 解决什么问题Ray Optics 是一款用于创建和模拟二维几何光学场景的 Web 应用。其核心是光线追踪引擎沿单条光线逐段模拟传播路径计算光线遇到镜面或玻璃界面时的反射与折射。场景用 JSON 文本描述因此可以保存、分享也能被其他程序直接调用。核心能力适用场景拖拽式场景编辑 实时光线追踪课堂演示、快速验证光学原理自定义曲面镜面、玻璃、梯度折射率材料均可用方程定义设计非常规光学元件颜色混合、颜色滤光、色散白光与棱镜现象分析探测器读数 辐照度图导出 CSV实验与科研数据量化Python / Julia 调用接口脚本化批量仿真快速上手 路径一在线版。项目官网提供在线版本地址见仓库根目录 README.md 的 Links 部分浏览器打开即是模拟器同站还有包含几十个现成示例场景的画廊可直接打开观察和修改。路径二本地克隆适合开发与二次开发。要求本机已安装 Node.js 18 及以上版本git clone https://gitcode.com/gh_mirrors/ra/ray-optics cd ray-optics npm install --no-optional npm run start运行后浏览器会自动打开http://localhost:8080/simulator/左侧工具栏选择光学元件右侧面板编辑对象属性修改代码时页面自动重载。--no-optional会跳过 node-canvas 等仅用于生成图片的可选依赖安装更快。不写代码的读者还有第三条路下载预构建包后用 Simple Web Server 打开文件夹本地就能运行包含模拟器与画廊的完整站点具体步骤见 run-locally/ 的图文指南。功能深读 模拟透镜与镜面成像元件库覆盖单条光线、平行/发散光束、平面与曲面镜、球面透镜、理想透镜、分束器等。仿真结束后可以开启光线延长线查看虚像位置也可以直接显示实像、虚像以及从某个给定位置能看到什么。复合显微镜、开普勒望远镜等标准系统都在 data/galleryScenes/ 里可作为学习样例。模拟颜色混合与色散白光、颜色滤光和色散折射角随波长变化都可以仿真一束白光通过棱镜后如何展开成光谱、不同颜色光线在屏上如何叠加都能在场景里调出来看。画廊中的 chromatic-dispersion、prisms 等场景就是围绕这些现象制作的。光线密度与性能参数复杂场景卡顿时先看工具栏的光线密度设置密度越高光路越完整计算也越慢。还可以配合光线截断和最大反射/折射深度来收敛计算量。默认使用 CPU 引擎WebGPU 引擎已处于预览阶段计划见 ROADMAP.md。AI 辅助编写模块场景ai-tools/ 目录存放 Ray Optics Coder 聊天机器人的指令与知识文件。这些文件描述了点光源、透镜、模块等场景 JSON 的写法约定你可以用它搭建自己的助手让助手按光学需求生成场景代码。跟做案例复现黑猫变白的全内反射效果目标演示全内反射造成的一种视觉效果——装在密封塑料袋里的黑色物体沉入水下后从上方看却呈白色。操作在模拟器中打开 data/galleryScenes/ 下的 black-cat-becomes-white 场景场景 JSON 可直接导入。该场景由一块折射率 1.33 的水体玻璃、发散光源、多个 blocker 拼成的猫形轮廓和一个拖拽把手组成直接拖动把手就能把塑料袋移出水下或拉回水上。结果袋子没入水下时周围环境的绝大部分光在水—塑料袋界面上发生全内反射回到观察者眼睛的方向黑猫的轮廓因此看起来是白色把袋子拉出水面后立刻恢复黑色。这个场景里的 Handle 对象也可以直接复制到你自己的场景中做出同样拖动即变的交互演示。避坑指南 ️完整构建很慢npm run build要为画廊生成大量图片约需半小时只跑模拟器用npm install --no-optionalnpm run start即可。Node.js 版本过低会装不上依赖需要 18 及以上node-canvas 报错通常是系统级依赖缺失。开发模式npm run start下导入模块窗口和部分页面链接不可用需先执行一次npm run build生成 dist 目录。复杂场景卡顿先降低光线密度和最大反射/折射深度再逐步调高确认是性能问题而非精度问题。从脚本导出图片走 node 版模拟器依赖可选的 node-canvas 包缺包时导出会失败。生态与资源文档API 参考由 JSDoc 生成npm run build-docs并托管在官网仓库 README.md 有完整功能清单CITATION.md 说明引用规范。多语言locales/ 含 24 种语言的界面翻译翻译贡献不需要编程基础。外部集成integrations/ 提供命令行调用示例example_python.py、example_julia.jl把场景 JSON 传给模拟器即可拿到探测器读数或生成的图片。贡献途径新增画廊场景data/galleryScenes/、新增翻译、新增模块三类均面向非程序员代码贡献参考 CONTRIBUTING.md。路线图ROADMAP.md 规划了基元化光线追踪重构与 WebGPU 引擎更远期的方向包括 3D 光线追踪与波动光学仿真。Ray Optics 处在课堂演示工具与科研数据源之间同一份场景文件既能在浏览器里实时演示也能通过脚本取出探测器读数或导出成用于论文的矢量图。想先试试直接打开在线版想修改或集成按快速上手一节克隆仓库即可开始。【免费下载链接】ray-opticsA web app for creating and simulating 2D geometric optical scenes, with a gallery of (interactive) demos.项目地址: https://gitcode.com/gh_mirrors/ra/ray-optics创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考