爱意满满的作品展示区。
devcxlcn

3D 侦探线索墙 - 浏览器端的沉浸式线索白板

  •  1
     
  •   devcxlcn ·
    devcxl · 1 day ago · 621 views
    Image

    交互灵感来自 GTA5 抢劫前置任务中的计划黑板。用 Three.js 在浏览器里实现了一个 3D 空间,可以:

    • 张贴便利贴、A4 纸、照片、剪报、标签
    • 图钉固定资料,红绳建立关联
    • 记号笔直接批注,橡皮擦删除笔迹
    • 所有数据保存在浏览器 localStorage ,不上传服务器

    技术栈:React 19 + Three.js + React Three Fiber + Zustand

    Demo: https://clue-wall.devcxlcn.workers.dev/

    开源地址: https://github.com/devcxl/whiteboard

    欢迎体验反馈 👏

    4 replies    2026-07-29 18:00:01 +08:00
    xlxx
        1
    xlxx  
       23h 48m ago
    阴影的锯齿有点糙
    codehz
        2
    codehz  
       14h 28m ago
    说实话就这个精度来看,有什么用 three.js 的必要吗,考虑到几乎都没有视角形变,你用 css 3d 做不是基本就足够了
    duchenpaul
        3
    duchenpaul  
       11h 46m ago
    加上物理效果,比如说绳子晃动
    nightcatsama
        4
    nightcatsama  
       7h 37m ago
    只看现有的功能,确实还不如直接用 css 做
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1206 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 35ms · UTC 17:37 · PVG 01:37 · LAX 10:37 · JFK 13:37
    ♥ Do have faith in what you're doing.