The Black Hole

by gradbot

HTML

<script src=http://mrdoob.github.io/three.js/build/three.min.js></script>
<script src=http://mrdoob.github.io/three.js/examples/js/controls/OrbitControls.js ></script>
<span>Rays</span><input id="rayCount" type="range" min="10" max="500" value="50" /><br/>
<span>Bounces</span><input id="bounceCount" type="range" min="1" max="50" value="10" />

JavaScript

var info, renderer, scene, camera, controls, stats;

init();
animate();

function init() {
    var geometry, material, mesh, line;
    var size = 100;

    rayCountElement = document.getElementById('rayCount');
    bounceCountElement = document.getElementById('bounceCount');

    if (renderer)
    {
        renderer.domElement.remove();
        renderer = null;
    }

    renderer = new THREE.WebGLRenderer({
        alpha: 1,
        antialias: true,
        clearColor: 0xffffff
    });
    renderer.setSize(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.domElement);
    scene = new THREE.Scene();

    camera = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight, 1, 5000);
    camera.position.set(0, 1800, 0);
        controls = new THREE.OrbitControls( camera, renderer.domElement );

    // 100 segment line
    var basePoints = [
        [ 0,  0],
        [ 1,  0],
        [ 1,  1],
        [ 2,  1],
        [ 2,  2],
        [ 3,  1],
        [ 3,  0],
        [ 4,  0],
        [ 3, -1],
        [ 2, -1],
        [ 2, -2],
        [ 1, -1],
        [ 0, -1],
        [ 0, -2],
        [-1, -1],
        [-2, -2],
        [-2, -1],
        [-3, -1],
        [-4,  0],
        [-3,  0],
        [-3,  1],
        [-2,  2],
        [-2,  1],
        [-1,  1],
        [-1,  0],
        [ 0,  0],
    ];

    var points = [];
    for (var i = 0, len = basePoints.length; i < len; i++) {
        points.push([basePoints[i][0] * size, -basePoints[i][1] * size]);
    }

    line = drawBoxLines(points, 10, 4);
    scene.add(line);

    var bounceCount = bounceCountElement.value;
    var rayCount = rayCountElement.value;

    var rays, ray, newRay;
    for (var r = 0.01, rEnd = 2.0 * Math.PI, rStep = rEnd / rayCount; r < rEnd; r += rStep) {
        rays = [];
        ray = [
            -2 * size,
            0,
            Math.sin(r) * size, 
            Math.cos(r) * size,
            -1
        ];

        if (ray)...