JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://threejs.org/build/three.js"></script>

JavaScript

// Animate the drawing of a line using LineDashedMaterial hack

var mesh, scene, camera, geometry, hit, mouse = new THREE.Vector2(), raycaster = new THREE.Raycaster(), plane, drag = false,
    vectorZero = new THREE.Vector3(), text;

init();

function init() {

  // info
  text = document.createElement( 'span' );
  text.style.position = 'absolute';
  text.style.top = '30px';
  text.style.width = '100%';
  text.style.color = '#fff';
  text.style.fontWeight = 'bold';
  text.style.backgroundColor = 'transparent';
  text.style.zIndex = '1';
  text.style.fontFamily = 'Monospace';
  text.innerHTML = 'Some random name';
  document.body.appendChild( text );

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

  // scene
  scene = new THREE.Scene();

  // camera
  camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 10000 );
  camera.position.z = 15;

  geometry = new THREE.BoxBufferGeometry( 1, 1, 1 );
  material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
  mesh = new THREE.Mesh( geometry, material );


  plane = new THREE.Mesh(new THREE.PlaneBufferGeometry(100, 100), new THREE.MeshBasicMaterial({
    color: 0xf00000,
    alphaTest: 0,
    visible: false
  }));
  
  // move mesh down
  mesh.position.y = -3;
  
  // removing this shows mesh but wont set texts inital position.
  toScreenPosition(mesh.position);

  scene.add( mesh, plane);
}

function toScreenPosition(vector) {
  camera.updateMatrixWorld();

  vector.project(camera);
  
  console.log( vector );

  // vector.z = 0;
  vector.x = Math.round((0.5 + vector.x / 2) * (renderer.domElement.width / window.devicePixelRatio));
  vector.y = Math.round((0.5 - vector.y / 2) * (renderer.domElement.height / window.devicePixelRatio));

  text.style.top = vector.y + 'px';
  text.style.left = vector.x + 'px';
}


function mouseMove(event) {
  mouse.x = ( event.clientX /...