JSFiddle - React, Tailwind, and code Playground

by navinleon

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r76/three.js"></script>

JavaScript

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

var renderer = new THREE.WebGLRenderer({antialias:true});
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

var dashMaterial = new THREE.LineDashedMaterial( { color: 0xee6666, dashSize: 0, gapSize: 0, linewidth:6  } ),
circGeom = new THREE.CircleGeometry( 10, 80, 0, 5 );

circGeom.vertices.shift();
circGeom.computeLineDistances();

var circ = new THREE.Line( circGeom, dashMaterial);
scene.add( circ );

camera.position.z = 20;

function render() {
    requestAnimationFrame( render );

   //circ.rotation.x += 0.01;
   //circ.rotation.y += 0.01;

    renderer.render(scene, camera);
}
render();