JSFiddle - React, Tailwind, and code Playground

by asierta

HTML

<html>
<head>
    <title>My first three.js app</title>
    <style>
        body { margin: 0; }
        canvas { width: 100%; height: 100% }
    </style>
</head>
<body>
<script src="js/three.js"></script>
<script src="js/OrbitControls.js"></script>
<script>
    camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 1000 );
    controls = new THREE.OrbitControls( camera );
    camera.position.set( 20, 20, 20 );
    controls.update();

    controls.minDistance = 0;
    controls.maxDistance = 70;

    var scene = new THREE.Scene();
    // var camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight, 0.1, 1000 );
    scene.add( new THREE.AxisHelper( 20 ) );

    var renderer = new THREE.WebGLRenderer();
    renderer.setSize( window.innerWidth, window.innerHeight );
    document.body.appendChild( renderer.domElement );

    var bones = [];

    var joint0 = new THREE.Bone();
    var joint1 = new THREE.Bone();
    var joint2 = new THREE.Bone();
    var joint3 = new THREE.Bone();
    var joint4 = new THREE.Bone();
    var joint5 = new THREE.Bone();
    var joint6 = new THREE.Bone();
    var joint7 = new THREE.Bone();
    var joint8 = new THREE.Bone();
    var joint9 = new THREE.Bone();
    var joint10 = new THREE.Bone();
    var joint11 = new THREE.Bone();
    var joint12 = new THREE.Bone();
    var joint13 = new THREE.Bone();
    var joint14 = new THREE.Bone();
    var joint15 = new THREE.Bone();
    var joint16 = new THREE.Bone();
    var joint17 = new THREE.Bone();
    var joint18 = new THREE.Bone();
    var joint19 = new THREE.Bone();
    var joint20 = new THREE.Bone();
    var joint21 = new THREE.Bone();
    var joint22 = new THREE.Bone();
    var joint23 = new THREE.Bone();
    var joint24 = new THREE.Bone();

    // Jerarquia
    joint0.add(joint16);
    joint16.add(joint17);
    joint17.add(joint18);
    joint18.add(joint19);

    joint0.add(joint12);
    joint12.add(joint13);
    joint13.add(joint14);
   ...