Spielereien mit HTML, PhP, etc

lima-city → Forum → Programmiersprachen → PHP, MySQL & .htaccess

Autor dieses Themas
~~h***********r~~

3:05, 28.12.2017
Hallöchen ;)

Da noch einige Tage Ferien sind, habe ich etwas Zeit sinnlosen Beschäftigungen nach zu gehen, nur damit man sieht was mal gemacht hat. Dabei habe ich mir einige Gedanken gemacht was so ganz lustig sein könnte, leider habe ich nicht wirklich Ideen wie man das umsetzen kann.

Das erste was ich machen würde ist vermutlich schon nicht ganz so einfach. Ich habe eine Tabelle voller x,y und z Werte. Diese würde ich ganz gern Grafisch darstellen, sodass diese Punkte eine Art Relief erzeugen welches betrachtet werden kann. Aber wie wandle ich die Daten in eine Grafik um und vor allem, wie erzeugt man die 3D Wirkung?

Das zweite wäre geometrische Formen in Bilder zu finden, unabhängig von deren Größe, Farbe und Rotation, um dann deren Position + Position bestimmter Punkte der Form, Rotation und Größe herraus zufinden. Letztendlich soll aus diesen Werten ein Bild aus gegebenen Formen wieder zusammen gesetzt werden können, welches dem Original evtl ähnelt. Hierbei habe ich aber keine Idee wie und ob das ganze mit halbwegs umsetzbar ist, vielleicht erst in anderen Farbraum konvertieren....

Vielleicht fällt euch dazu etwas ein, wie man das ganze lösen könne. Dankeschön :)

Beitrag zuletzt geändert: 28.12.2017 3:13:28 von horstexplorer
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage
tchiarcos

tchiarcos hat kostenlosen Webspace.

10:22, 28.12.2017
Hi Horst,

anbei mal eine Seite, die helfen könnte:

https://www.php-kurs.com/grafiken-erstellen-mit-php.htm
Autor dieses Themas
~~h***********r~~

1:24, 29.12.2017
Dankeschön dafür :)
PhP scheint zumindest fürs Darstellen nicht ganz geeignet. Ich habe da etwas schönes gefunden, bekomme es leider aber nicht bei mir zum laufen, evtl kann mir da jemand mit einem ganz einfachem Beispiel helfen (1 Punkt im Raum), bekomme den Code nicht richtig zusammen gebaut.
https://threejs.org
Bsp für Anwendungen
https://threejs.org/examples/
tchiarcos

tchiarcos hat kostenlosen Webspace.

12:40, 29.12.2017
das ist Javascript, damit bin ich vorerst raus! Nicht meine Domäne

Aber hab es grad mal ein weig durchforstet. Sieht echt interessant aus, werd mal das nutzen um ein wenig mit zu spielen bei Gelegenheit

Beitrag zuletzt geändert: 29.12.2017 12:46:48 von tchiarcos

Autor dieses Themas

~~h***********r~~

14:06, 29.12.2017

Haben da ein hübsches Beispiel:

<html>
	<head>
		<title>My first three.js app</title>
		<style>
			body { margin: 0; }
			canvas { width: 100%; height: 100% }
		</style>
	</head>
	<body>
		<script src="js/three.js"></script>
		<script>
			var scene = new THREE.Scene();
			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight, 0.1, 1000 );

			var renderer = new THREE.WebGLRenderer();
			renderer.setSize( window.innerWidth, window.innerHeight );
			document.body.appendChild( renderer.domElement );

			var geometry = new THREE.BoxGeometry( 1, 1, 1 );
			var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
			var cube = new THREE.Mesh( geometry, material );
			scene.add( cube );

			camera.position.z = 5;

			var animate = function () {
				requestAnimationFrame( animate );

				cube.rotation.x += 0.01;
				cube.rotation.y += 0.01;

				renderer.render(scene, camera);
			};

			animate();
		</script>
	</body>
</html>

Nur leider kann die Scene nicht per Maus rotiert werden. Evtl bekomme ich noch raus wie das geht.
//Edit
Das war einfacher als ich dachte:

<html>
	<head>
		<title>My first three.js app</title>
		<style>
			body { margin: 0; }
			canvas { width: 100%; height: 100% }
		</style>
	</head>
	<body>
		<script src="js/three.js"></script>
		<script src="js/OrbitControls.js"></script>
		<script>
			var scene = new THREE.Scene();
			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight, 0.1, 1000 );

			var renderer = new THREE.WebGLRenderer();
			renderer.setSize( window.innerWidth, window.innerHeight );
			document.body.appendChild( renderer.domElement );

			var geometry = new THREE.BoxGeometry( 1, 1, 1 );
			var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
			var cube = new THREE.Mesh( geometry, material );
			scene.add( cube );

			camera.position.z = 5;

			var animate = function () {
				requestAnimationFrame( animate );

				cube.rotation.x += 0.00;
				cube.rotation.y += 0.00;

				renderer.render(scene, camera);
			};

			animate();
			controls = new THREE.OrbitControls( camera, renderer.domElement );
		</script>
	</body>
</html>

Die andere js gibts hier https://gist.github.com/mrflix/8351020

Beitrag zuletzt geändert: 29.12.2017 14:10:35 von horstexplorer

Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

lima-city bietet dir kostenlosen und werbefreien Speicherplatz für Deine Homepage. Sofort anmelden und direkt loslegen mit Webspace, PHP, Datenbanken, günstigen Domains und einer tollen Community!

kostenloser Webspace werbefrei: lima-city