Three.js 场景在线编辑器 - 拖拽添加模型和灯光
在浏览器中构建 3D 场景,添加基本几何体、光源,导出场景代码。
UD5工具箱
在浏览器中构建 3D 场景,添加基本几何体、光源,导出场景代码。
在图片上拖拽四个角点,实现任意四边形映射,模拟三维空间中的图片摆放效果。
通过滑块实时调整 perspective、rotateX/Y/Z 等属性,观察卡片、立方体等元素的 3D 效果。
展示电磁波在空间中电场和磁场相互垂直的传播动画,可旋转视角。
实时调整立方体尺寸、旋转角度和面颜色,生成纯CSS 3D立方体及动画。
提取图片中每个像素的RGB值并在3D空间中以小球显示,直观查看主色分布。
加载 HDR 或普通全景图,以 3D 天空盒方式旋转查看。
通过堆叠多层text-shadow或box-shadow创造浮雕或厚重立体文字效果,复制代码。
利用AbsoluteOrientationSensor绘制一个匹配设备真实朝向的三维指南针。
使用 Canvas 生成带有光照和凹凸效果的 3D 渐变纹理,可导出无缝平铺图。
以3D渲染(p,q)环面纽结,可旋转视角,感受拓扑之美。
Three.js实现的第一人称视角迷宫游戏,键盘控制移动与转向,限时找到出口。
设置卡片正面和背面内容,生成鼠标悬停时沿X轴或Y轴3D翻转的CSS动画。
使用Web Audio PannerNode,在头顶环绕拖拽一个声源,体验声音在空间的移动。
以线框形式渲染正四面体、立方体等柏拉图立体,可鼠标拖拽旋转。
加载文本格式的STL模型文件,以线框形式旋转查看它的三维结构。
通过多层 text-shadow 叠加生成具有厚度和光照感的 3D 文字效果。
输入 SMILES 字符串,生成简单的 3D 分子球棍模型并可旋转缩放,用于化学可视化。
以3D方式展示太阳系大致轨道,可缩放和加速时间,观察行星公转顺序。
展示常见晶体的三维晶胞结构(面心立方、体心立方、金刚石等),可旋转观察。
上传深度图或选择预设形状,生成可通过平行眼或交叉眼观看的单图像立体图。
选择水、甲烷等预置分子,展示旋转的3D球棍模型(基于Three.js)。
用WebGL或Three.js(轻量版)展示一条旋转的莫比乌斯带,可用鼠标拖拽视角。
用Three.js展示三维魔方,鼠标拖拽整体视角,按钮转动层面,可打乱与复原。