Just to inform you my standard of knowledge:
I have basic knowledge of HTML, JS, … Have done VRML many years ago.
Used to do FORTRAN programming for Engineering applications.
In any event, you question is very broad and it won’t happen that somebody provides you a complete manual for developing such an app. It might be better to break down your task into smaller ones and then try to find respective solutions. For example you can independently implement the particles effects, the controls and the UI.
Thank you @Mugen87. I appreciate .
I have already started to break it down into smaller tasks. Not sure what you mean by THREE.WebGLRenderer 71. I will search the web to see if I can find more information on this.
I had few health issues. Hence I could not carry on with the project I started. Now I am trying to continue from where I left.
I am trying to make the example given by @Mugen87 work locally on my laptop. I have already downloaded three.js and not sure how to handle these lines found in the example
import * as THREE from ‘…/build/three.module.js’;
import Stats from ‘./jsm/libs/stats.module.js’;
Download the three npm package and then write your imports like so:
import * as THREE from 'three';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
stats.js is a separate npm package. You can then use rollup as your bundler.
BTW: Instead of import every class into the THREE namespace, you can also write so called named imports. So you only import the classes you are actually need in your project. It could look like so:
I would like to know how to read coordinates of points from a text file and plot them. I could not find this information on from three.js site.
This text file contains three columns
x y z
10. 30 40.
…
I am unable to figure out why this is not working. Examples that came with three.js are working fine. Thank you
Source file is in …\threejs\Thiru
three.js is in …\threejs\three.js-master\three.js-master
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
var camera = new THREE.PerspectiveCamera(45, Window.innerWidth / window.innerHeight, 1, 1000);
camera.position.y = -400;
camera.position.z = 400;
camera.position.x = .70;
var scene = new THREE.Scene();
var plane = new THREE.Mesh(new THREE.PlaneGeometry(300,300, new THREE.MeshNormalMaterial(();
scene.add(plane);
renderer.render(scene, camera);
</script>
</body>