JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/npm/three@0.140.2/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.140.2/examples/js/controls/OrbitControls.js"></script>

CSS

body {
  margin: 0;
}

JavaScript

var scene = new THREE.Scene();

// const cameraPosition = [0, 0, 4];
// const pointPosition = [0, 0, 0];

const cameraPosition = [582673.8464441065, 4144966.2127792083, 137.8905194311];
const pointPosition = [582673.8464441065, 4144966.2127792085, 134.8905194311];

const axesHelper = new THREE.AxesHelper(1);
axesHelper.position.set(...pointPosition);
scene.add(axesHelper);

// Create a basic perspective camera
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.set(...cameraPosition);
camera.lookAt(new THREE.Vector3(...pointPosition));

// Create a renderer with Antialiasing
var renderer = new THREE.WebGLRenderer({
  antialias: true
});

// Configure renderer clear color
renderer.setClearColor("#000000");

// Configure renderer size
renderer.setSize(window.innerWidth, window.innerHeight);

// Append Renderer to DOM
document.body.appendChild(renderer.domElement);

const dotGeometry = new THREE.PlaneGeometry();
const dotMaterial = new THREE.MeshBasicMaterial({
  color: 'red'
});
const dot = new THREE.Mesh(dotGeometry, dotMaterial);
dot.position.set(...pointPosition)
dot.scale.multiplyScalar(0.1);
scene.add(dot);

const controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.addEventListener('change', render);
controls.target.set(...pointPosition);
controls.update();

function render() {
  dot.quaternion.copy(camera.quaternion);
  renderer.render(scene, camera);

}

render();