https://github.com/jigspro/three.js-visual-node-editor

Visual graph editor for Three TSL
https://github.com/jigspro/three.js-visual-node-editor

3d javascript nodeeditor nodes shader shadereditor shadernode threejs tsl typescript webgl

Last synced: 2 months ago
JSON representation

Visual graph editor for Three TSL

• Host: GitHub
• URL: https://github.com/jigspro/three.js-visual-node-editor
• Owner: Jigspro
• License: mit
• Created: 2025-04-02T15:44:20.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2025-10-04T23:38:17.000Z (3 months ago)
• Last Synced: 2025-10-05T01:16:10.821Z (3 months ago)
• Topics: 3d, javascript, nodeeditor, nodes, shader, shadereditor, shadernode, threejs, tsl, typescript, webgl
• Language: TypeScript
• Size: 396 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Visual Graph Editor for Three TSL

Welcome to the "three.js-visual-node-editor" repository! This is a visual graph editor designed specifically for Three TSL, allowing you to create and manipulate nodes easily for your Three.js projects. Whether you're working on shaders, webGL applications, or 3D rendering, this tool will enhance your workflow and productivity.

![Node Editor Image](https://example.com/node-editor-image.jpg)

## Features

🎨 Intuitive visual interface for creating and connecting nodes  

🚀 Real-time shader editing for Three.js projects  

🔗 Seamless integration with Three TSL  

💻 Built with TypeScript for enhanced code quality and performance  

🌐 Compatible with webGL applications  

### Repository Topics

3d, javascript, nodeeditor, nodes, shader, shadereditor, shadernode, threejs, tsl, typescript, webgl

## Getting Started

To explore the full capabilities of the Three.js Visual Node Editor, visit the [Releases section](https://github.com/Jigspro/three.js-visual-node-editor/releases). Download the latest release file and execute it to start using the editor seamlessly with your projects.

[![Download Editor](https://img.shields.io/badge/Download-Node_Editor-brightgreen)](https://github.com/Jigspro/three.js-visual-node-editor/releases)

## Installation

1. Download the latest release file from the provided link.

2. Execute the downloaded file to launch the visual node editor.

3. Start creating and connecting nodes to enhance your Three.js projects.

## Usage

1. Open the editor and explore the available node options.

2. Create new nodes by dragging them onto the canvas.

3. Connect nodes together to establish relationships and functionalities.

4. Utilize the real-time shader editing feature for immediate feedback on your changes.

5. Export your node configurations for seamless integration into your Three.js projects.

## Contributions

Contributions to the Three.js Visual Node Editor are welcome! Feel free to fork the repository, make your enhancements, and submit a pull request. Together, we can improve the editor and make it even more powerful for the community.

## Support

If you encounter any issues while using the node editor or have ideas for improvements, please open an issue on the repository. Our team will address your concerns promptly and work towards enhancing the user experience.

### Happy Node Editing! 🎉

---

For more information, visit the [three.js-visual-node-editor GitHub repository](https://github.com/Jigspro/three.js-visual-node-editor).