Commit 3ec5aff7 authored by ba yaye-awa's avatar ba yaye-awa
Browse files

add grid and axis labels

parent 02aafd5e
......@@ -18,7 +18,7 @@
var scene = new THREE.Scene();
// Load Camera Perspektive
var camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 20000 );
var camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.set( 1, 1, 20 );
//camera.position.x = 50;
//camera.position.z = - 50;
......@@ -47,17 +47,80 @@
var axesHelper = new THREE.AxesHelper( 5 );
scene.add( axesHelper );
var gridHelper = new THREE.GridHelper( 10, 10, 0x0000ff, 0x0000ff );
scene.add( gridHelper );
var loader = new THREE.FontLoader();
loader.load( '../stylesheets/helvetiker_bold.typeface.json', function ( font ) {
// Position of axes extremities
var positionEndAxes = axesHelper.geometry.attributes.position;
var textGeoX = new THREE.TextGeometry('X', {
font: font,
size: 0.2,
height: 0.01,
});
var colorX = new THREE.Color('white');
var textMaterialX = new THREE.MeshBasicMaterial({ color: colorX });
var textX = new THREE.Mesh(textGeoX , textMaterialX);
var label1X = positionEndAxes.getX(0);
textX.position.x = label1X+5;
textX.position.y = 0;
textX.position.z = 0;
textX.rotation = camera.rotation;
var textGeoY = new THREE.TextGeometry('Y', {
font: font,
size: 0.2,
height: 0.01,
});
var colorY = new THREE.Color('white');
var textMaterialY = new THREE.MeshBasicMaterial({ color: colorY });
var textY = new THREE.Mesh(textGeoY , textMaterialY);
var label1Y = positionEndAxes.getY(0);
textY.position.x = 0
textY.position.y = label1Y+5;
textY.position.z = 0;
textY.rotation = camera.rotation;
var textGeoZ = new THREE.TextGeometry('Z', {
font: font,
size: 0.2,
height: 0.01,
});
var colorZ = new THREE.Color('white');
// color.setRGB(255, 250, 250);
var textMaterialZ = new THREE.MeshBasicMaterial({ color: colorZ });
var textZ = new THREE.Mesh(textGeoZ , textMaterialZ);
var label1Z = positionEndAxes.getZ(0);
textZ.position.x = 0
textZ.position.y = 0;
textZ.position.z = label1Z+5;
textZ.rotation = camera.rotation;
scene.add(textX);scene.add(textY);scene.add(textZ);
});
/* var geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
var material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
var box = new THREE.Mesh( geometry, material );
var helper = new THREE.VertexNormalsHelper( box, 2, 0x00ff00, 1 );
scene.add( box );
scene.add( helper );*/
// glTf Loader
var loader = new THREE.GLTFLoader();
loader.load( '<%=gltfFile%>', function ( gltf ) {
var object = gltf.scene;
loader.load( '<%=gltfFile%>', function ( gltf ) {
gltf.scene.scale.set( 2, 2, 2 );
gltf.scene.position.x = 0; //Position (x = right+ left-)
gltf.scene.position.y = 0; //Position (y = up+, down-)
gltf.scene.position.y = 0; //Position (y = up+, down-)
gltf.scene.position.z = 0; //Position (z = front +, back-)
scene.add( gltf.scene );
});
});
function animate() {
render();
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment