Hallo liebe Community, schön dass ich auf euch gestoßen bin 
Ich bin die Sarah und dies ist mein erster Post hier
Ich befasse mich seit einigen Wochen mit meinem Vorhaben, wo ich nicht voran komme und verzweifle da ich jedes findbare und passende Tutorial schon x Mal durchgemacht habe - ohne Erfolg. Es gibt viele und darunter sehr gute Anbieter die das alles vereinfachen (Account erstellen und Model uploaden), aber das Ergebnis ist dann mit Branding oder Social Media Buttons versehen...
Ziel: Ein interaktiver (simple Bewegungsnavigation mit der Mouse) 3D Modelbetrachter auf der Homepage.
Wie ich vorging: 3D Model als .json exportiert und dann anhand der Tutorials das HTML und die js programmiert mit der Einbindung des 3D Modelles im .json Format. Alle Dateien habe ich im "www" Ordner des "Wamp64" Berzeichnisses "WebGL".
Hier ist mein letzter Skript, den ich versucht habe. Könnt Ihr mir sagen was ich zur Hölle falsch mache oder es richtig geht?!
(im Root Ordner habe ich einen "JS" Ordner mit den 3 js. Dateien drin und einen "Models" Ordner mit dem 3D Model "maschine" drin).
Zur Technik:
Windows 7 64bit
Notepad++
Mozilla Firefox
Wamp64 (grünes Symbol leuchtet)
diverse 3D Modelling/ Render Software
Ich hoffe sehr, es kann mir wirklich jemand mal helfen
Liebe Grüße
Sarah
Ich bin die Sarah und dies ist mein erster Post hier Ich befasse mich seit einigen Wochen mit meinem Vorhaben, wo ich nicht voran komme und verzweifle da ich jedes findbare und passende Tutorial schon x Mal durchgemacht habe - ohne Erfolg. Es gibt viele und darunter sehr gute Anbieter die das alles vereinfachen (Account erstellen und Model uploaden), aber das Ergebnis ist dann mit Branding oder Social Media Buttons versehen...
Ziel: Ein interaktiver (simple Bewegungsnavigation mit der Mouse) 3D Modelbetrachter auf der Homepage.
Wie ich vorging: 3D Model als .json exportiert und dann anhand der Tutorials das HTML und die js programmiert mit der Einbindung des 3D Modelles im .json Format. Alle Dateien habe ich im "www" Ordner des "Wamp64" Berzeichnisses "WebGL".
Hier ist mein letzter Skript, den ich versucht habe. Könnt Ihr mir sagen was ich zur Hölle falsch mache oder es richtig geht?!
(im Root Ordner habe ich einen "JS" Ordner mit den 3 js. Dateien drin und einen "Models" Ordner mit dem 3D Model "maschine" drin).
Code:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Model Viewer </title>
<script src="js/Three_min.js"> </script>
<script src="js/TrackballControls.js"> </script>
<script src="js/JSONLoader.js"> </script>
<script type="text/javascript">
function onLoad(){
initScene();
function initScene()
var container = document.getElementById("container");
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setSize(window.innerWidth, window.innerHeight);
container.appendChild( renderer.domElement );
}
}
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera( 75, container.offsetWidth / container.offsetHeight, 1, 1000 );
camera.position.z = 10;
scene.add( camera );
controls = new THREE.TrackballControls( camera, renderer.domElement );
controls.rotateSpeed = 1.0;
controls.zoomSpeed = 1.2;
controls.panSpeed = 0.2;
controls.noZoom = false;
controls.noPan = false;
controls.staticMoving = false;
controls.dynamicDampingFactor = 0.3;
controls.minDistance = 1.1;
controls.maxDistance = 100;
controls.keys = [ 16, 17, 18 ]; // [ rotateKey, zoomKey, panKey ]
var dirLight = new THREE.DirectionalLight(0xffffff, 0.95);
dirLight.position.set(-3, 3, 7);
dirLight.position.normalize();
scene.add(dirLight);
var pointLight = new THREE.PointLight(0xFFFFFF, 5, 50);
pointLight.position.set(10, 20, -10);
scene.add(pointLight);
var jsonLoader = new THREE.JSONLoader();
jsonLoader.load( "models/maschine.js", function( geometry ) {
var maschine = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial() );
scene.add(maschine);
} );
animate();
function animate() {
requestAnimationFrame( animate );
render();
}
function render() {
renderer.render( scene, camera );
}
function render() {
controls.update(); //for cameras
renderer.render( scene, camera );
}
</script>
</head>
<body onLoad="onLoad();">
<div id='container'>
</div>
</body>
</html>Zur Technik:
Windows 7 64bit
Notepad++
Mozilla Firefox
Wamp64 (grünes Symbol leuchtet)
diverse 3D Modelling/ Render Software
Ich hoffe sehr, es kann mir wirklich jemand mal helfen
Liebe Grüße
Sarah
