JSFiddle - React, Tailwind, and code Playground

by Hesam Yavari

HTML

<script src="https://threejs.org/build/three.min.js"></script>
<div id="center">

</div>

JavaScript

var camera, scene, renderer;
			var geometry, material, circle, mesh, points ,line;
			var light, ambientLight, intersects;
			var objects = [], pointObj = [];
			var hovered, clicked, temp = 0, deltaX = 0;
			var mouseBegin = new THREE.Vector3(0,0,0);
			var mouseEnd = new THREE.Vector3(0,0,0);
			var index;

			var raycaster = new THREE.Raycaster();
			var mouse = new THREE.Vector2();
			init();
			animate();

			function init() {

				camera = new THREE.PerspectiveCamera( 70, (window.innerWidth) / window.innerHeight, 0.01, 1000 );
				camera.position.z = 30;

				scene = new THREE.Scene();
				

				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: true } );
				renderer.setClearColor(0xffffff, 1);
				renderer.setSize( window.innerWidth, window.innerHeight );
				var center = document.getElementById("center");
				center.appendChild( renderer.domElement );

				ambientLight = new THREE.AmbientLight(0x404040);
				scene.add(ambientLight);

				light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
				scene.add( light );
				light = new THREE.PointLight( 0xffffff, 1, 0, 2 );
				light.position.set( 10, 10, 10 );
				scene.add( light );
				light = new THREE.PointLight( 0xffffff, 1, 0, 2 );
				light.position.set( -10, -10, -10 );
				scene.add( light );

				geometry = new THREE.CircleBufferGeometry(4,32);
				material = new THREE.MeshBasicMaterial({color: 0x00ffff});
				circle = new THREE.Mesh(geometry, material);
				scene.add(circle);
				objects.push(circle);
				circle.geometry.computeBoundingBox();

				var pts = [];
				pts.push( circle.geometry.boundingBox.min);
				pts.push( new THREE.Vector3( circle.geometry.boundingBox.min.x, circle.geometry.boundingBox.max.y, 0 ) );
				pts.push( circle.geometry.boundingBox.max);
				pts.push( new THREE.Vector3( circle.geometry.boundingBox.max.x, circle.geometry.boundingBox.min.y, 0 ) );
				pts.push( circle.geometry.boundingBox.min);

				geometry = new THREE.BufferGeometry().setFromPoints( pts...