JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js" integrity="sha512-dLxUelApnYxpLt6K2iomGngnHO83iUvZytA3YjDUCjT0HDOHKXnVYdf3hU4JjM8uEhxf9nD1/ey98U3t2vZ0qQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://threejs.org/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 render = function () {
  renderer.render(scene, camera);
};

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

const dotGeometry = new THREE.BufferGeometry();
dotGeometry.setAttribute( 'position', new THREE.Float32BufferAttribute(pointPosition, 3 ) );
const dotMaterial = new THREE.PointsMaterial( { size: 0.1, color: 'red' } );
const dot = new THREE.Points( dotGeometry, dotMaterial );
scene.add( dot );

render();