An interactive web-based visualization of the Lorenz system, demonstrating chaotic behavior through real-time 3D rendering and phase space plotting.
This project provides a visual exploration of the Lorenz system, a set of ordinary differential equations first studied by Edward Lorenz in 1963. The system is notable for its chaotic solutions for certain parameter values and initial conditions, exhibiting what is now known as the "butterfly effect" - the sensitive dependence on initial conditions.
The visualization renders the Lorenz attractor in pseudo-3D space and provides a complementary phase space plot, allowing users to observe and interact with this classic example of deterministic chaos.
- Real-time visualization of the Lorenz system's evolution
- Interactive parameter adjustment for σ (sigma), ρ (rho), and β (beta)
- Multiple particle support to visualize sensitivity to initial conditions
- Phase space plotting showing the system's trajectory in the x-y plane
- Adjustable simulation speed for detailed observation
- Trail toggling to observe the full trajectory or focus on current state
- Lyapunov exponent approximation to quantify chaotic behavior
- Responsive design that adapts to different screen sizes
The Lorenz system is defined by three coupled differential equations:
dx/dt = σ(y - x)
dy/dt = x(ρ - z) - y
dz/dt = xy - βz
Where:
- σ (sigma) is the Prandtl number
- ρ (rho) is the Rayleigh number
- β (beta) is a physical proportion related to the aspect ratio of convection cells
The classic parameter values (σ=10, ρ=28, β=8/3) produce the iconic butterfly-shaped strange attractor.
- A modern web browser with JavaScript enabled (Chrome, Firefox, Safari, Edge)
- No additional libraries or dependencies required
-
Clone the repository:
git clone https://github.com/username/lorenz-system.git
-
Navigate to the project directory:
cd lorenz-system -
Open
index.htmlin your web browser:# On macOS open index.html # On Linux xdg-open index.html # On Windows start index.html
Alternatively, you can set up a local server:
# Using Python 3
python -m http.server
# Using Node.js
npx serveThen navigate to http://localhost:8000 or the port indicated in your terminal.
- Adjust parameters using the sliders in the control panel
- Reset the system to start with a single particle at the default position
- Toggle trails to show or hide the trajectory history
- Add particles to observe how slightly different initial conditions evolve differently
- Observe the phase space in the top-right corner showing the x-y projection
- Note the Lyapunov exponent approximation at the bottom left, indicating the degree of chaos
The visualization is implemented using vanilla JavaScript and HTML5 Canvas. The simulation:
- Numerically integrates the Lorenz equations using a simple Euler method
- Renders the solution in a pseudo-3D projection on the main canvas
- Provides a complementary phase space plot showing the x-y plane projection
- Updates parameters in real-time based on user input
- Approximates the Lyapunov exponent to quantify the chaotic behavior
The visualization has been tested on:
- Chrome 90+
- Firefox 88+
- Safari 14+
- Edge 90+
This project is licensed under the MIT License - see the LICENSE file for details.
MIT License
Copyright (c) 2013 Mark Otto.
Copyright (c) 2017 Andrew Fong.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
- Edward Lorenz for his pioneering work on chaos theory
- The many educators and enthusiasts who have made chaos theory accessible
Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
