Az/El Solver

Threejs

by jrj2211

HTML

<script src="https://threejs.org/build/three.min.js"></script><!--r83-->
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>

<div>
Base Station Position
</div>
<label> 
  Latitude
  <input type='range' min=-90 max=90 value=0 name='latitude' />
</label>

<lahttps://jsfiddle.net/51yerkvu/16/#collaboratebel> 
  Longitude
  <input type='range' min=0 max=360 name='longitude' />
</label>

<label> 
  Heading
  <input type='range' min=0 max=360 name='heading' />
</label>

<div>
Satellite Position
</div>
<label> 
  Latitude
  <input type='range' min=-90 max=90 value=0 name='sat_latitude' />
</label>

<label> 
  Longitude
  <input type='range' min=0 max=360 value=90 name='sat_longitude' />
</label>

JavaScript

var camera = new THREE.OrthographicCamera(window.innerWidth / -100, window.innerWidth / 100, window.innerHeight / 100, window.innerHeight / -100,
		.01, 100);
camera.zoom = 5;
camera.position.set(0, 0, 10);

var scene = new THREE.Scene();

const material = new THREE.MeshBasicMaterial( { color: 0x007F00, transparent: true, opacity: .75 } );
const wireframeMaterial = new THREE.MeshBasicMaterial( { color: 0x007F00, wireframe: true } );

const sphereGeometry = new THREE.SphereGeometry(1, 32, 32);
const sphere = new THREE.Mesh( sphereGeometry, material );
scene.add( sphere );

const helper = new THREE.AxesHelper(1);
sphere.add(helper);

const wireframe = new THREE.Mesh( sphereGeometry, wireframeMaterial );
//scene.add( wireframe );		

const pointGeometry = new THREE.BoxGeometry(0.05, 0.05, 0.05);
const pointMaterial = new THREE.MeshBasicMaterial({
  color: 0xFF0000,
});
const satellite = new THREE.Mesh(pointGeometry, pointMaterial);
scene.add(satellite);

const convertedGeometry = new THREE.BoxGeometry(0.06, 0.06, 0.06);
const convertedMaterial = new THREE.MeshBasicMaterial({
  color: 0x0000FF,
});
const convertedMarker = new THREE.Mesh(convertedGeometry, convertedMaterial);
scene.add(convertedMarker);

const baseStation = new THREE.AxesHelper(.5);
scene.add(baseStation);

const trackerGeometry = new THREE.BoxGeometry(0.05, 0.05, 0.05);
const trackerMaterial = new THREE.MeshBasicMaterial({
  color: 0xd2bd67,
});
const tracker = new THREE.Mesh(trackerGeometry, trackerMaterial);
baseStation.add(tracker);


var light = new THREE.PointLight();
light.position.set(0, 150, 0);
scene.add(light);

const dir = new THREE.Vector3( 1, 1, 0 );
const origin = new THREE.Vector3( 0, 0, 0 );
const length = 1;
const hex = 0xffff00;

const arrowHelper = new THREE.ArrowHelper( dir, origin, length, hex );
scene.add( arrowHelper );

const headingHelper = new THREE.ArrowHelper( dir, origin, length, 0x00FF00 );
scene.add( headingHelper );


var renderer = renderer = new...