Three.js Examples Editor

Add an edit button to the three.js/examples page to edit and preview example code in real-time using Monaco Editor。

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

Advertisement:

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

Advertisement:

작성자
温鑫
일일 설치 수
0
총 설치 수
6
평점
1 0 0
버전
1.0
생성일
2025-06-24
갱신일
2025-06-24
크기
159KB
라이선스
MIT
적용 사이트

Three.js Examples Live Editor

Adds an "Edit" button to the three.js/examples page.
Clicking it opens a Monaco Editor instance to modify the current example's code and preview changes in real time.

Features

  • Integrated Monaco Editor with a VSCode-like experience
  • Live editing and preview of example code
  • Basic type hints for core three.js APIs
  • No local setup required — test and prototype ideas instantly

How to Use

  1. Install this userscript
  2. Visit https://threejs.org/examples
  3. Click the ✎ button in the bottom-right corner
  4. Modify the code in the popup editor and see results instantly

Notes

  • The editor loads the source of the current example; some examples may rely on asynchronous resources
  • Type hints are simplified and focus on commonly used core APIs

This tool is intended for learning and quick prototyping with three.js examples. Feedback is welcome!