Español
PHP, HTML & JavaScript- Foro

3D Grafik - WebGL con three.js

 
- Página 1 -



HofK
Auf una heißen Tipp de IF hin, Yo me de tiempo
three.js  [...]  angeschaut. Como  [...]  (bastante unten) el ersten Resultate.
 
31.01.2016  
 



 
- Página 32 -



p.specht

Genial! Jetzt el Ganze todavía para una 3D-Drucker extrudierbar hacer, y luego el Firmen abwimmeln, el dir el Bude einrennen ...
 
Computer: Gerät, daß es in Mikrosekunden erlaubt, 50.000 Fehler zu machen, zB 'daß' statt 'das'...
27.01.2020  
 




HofK
HofK (13.10.2019)
para Problema "Wenn el en el Schnittlinie passende Zylinder en Kugel hinausragt"

Man findet bastante ligeramente Abhängigkeiten zwischen x, y y z, aber bisher Yo no brauchbare Parametrisierung erzeugen puede.



En Búsqueda después de algunos Dingen bin Yo en GeoGebra  [...]  mehr zufällig en una Parametrisierung gestoßen. [...]  El Herleitung es bastante knapp.  [...] 
Yo vermutete inmediatamente, dass esta no de el Bogenlänge abhängt (es en efecto r como! y z se linear verändert ) , aber de Neugier Yo ellos getestet. En größerer Anzahl de Teilstrecken sieht el Linie perfekt de, aber el Teilstrecken haben erheblich abweichende Längen. Damit es esta Parametrisierung no para el Triangulation geeignet, como Yo ungefähr igual largo Dreiecksseiten necesidad.



El letzten Werte en el stark abfallenden Teil son el problema.

Also restos lo en iterativen Solución.
<!DOCTYPE html>
<head>
<title> SphereCylinderPARAMETER  </title>
<meta charset="utf-8" />
</head>
<body></body>
<script src=" ../../js/three.min.112.js"></script>
<script src=" ../../js/OrbitControls.js"></script>
<script>
'use strict'
// @author hofk
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 55, window.innerWidth / window.innerHeight, 0.01, 1000 );
camera.position.set( -4, 8, 16 );
const renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.setClearColor( 0x999999, 1 );
const container = document.createElement('div' );
document.body.appendChild( container );
container.appendChild( renderer.domElement );
const controls = new THREE.OrbitControls( camera, renderer.domElement );
const axesHelper = new THREE.AxesHelper( 10 );
scene.add( axesHelper );
const lineGeo = new THREE.BufferGeometry( );
const linesPos = new Float32Array( 1000 * 3 );
lineGeo.setAttribute('position', new THREE.BufferAttribute( linesPos, 3 ) );
const detail = 100;
const detailLine = 16;
const R = 5;
const r = 4;
const s = 3;
let x, y, z, x0, y0, z0;
const k1 = Math.sqrt( Math.max( 0, Math.min( R*R - (s-r)*(s-r), R*R - (s+r)*(s+r) ) ) );
const k2 = Math.sqrt( Math.max( R*R - (s-r)*(s-r), R*R - (s+r)*(s+r) ) );
let k = k1;

for ( let i = 0; i < detailLine ; i ++ ) {

    point( i );

    if ( i > 0 ) console.log('Lengt' , Math.sqrt( (x-x0)*(x-x0) + (y-y0)*(y-y0) + (z-z0)*(z-z0) ) );

        x0 = x;
        y0 = y;
        z0 = z;
        k += ( k2 - k1 ) / detailLine  ;

    }

    k = k2;
    point( detailLine );
    const  lineMaterial = new THREE.LineBasicMaterial({ color: 0xffffff });
    const  line = new THREE.Line( lineGeo, lineMaterial );
    scene.add( line );
    const seg = detail;
    const cylen = 12;
    const exc = -s;
    const sphereGeometry = new THREE.SphereBufferGeometry( R , seg, seg );
    const sphereMaterial = new THREE.MeshBasicMaterial( { color: 0x333300, side: THREE.DoubleSide, transparent: true, opacity: 0.3, wireframe: true} );
    const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
    scene.add( sphere );
    const cylinderGeometry = new THREE.CylinderBufferGeometry( r, r, cylen, seg, seg, true );
    const cylinderMaterial = new THREE.MeshBasicMaterial( {color: 0xaaaa00, side: THREE.DoubleSide, transparent: true, opacity: 0.3, wireframe: falso } );
    const cylinder = new THREE.Mesh( cylinderGeometry, cylinderMaterial );
    cylinder.position.x = -exc;
    cylinder.rotation.x = Math.PI / 2;
    scene.add( cylinder );
    animate( );

    function point( i ) {

        x = 1 / (2*s) * ( R*R - r*r + s*s - k*k );
        y = Math.sqrt( R*R - 1 / ( 4 * s*s ) * ( R*R - r*r + s*s - k*k )*( R*R - r*r + s*s - k*k ) - k*k );
        z = k;
        linesPos[ i * 3     ] = x ;
        linesPos[ i * 3 + 1 ] = y ;
        linesPos[ i * 3 + 2 ] = z;

    }

    function animate( ) {

        requestAnimationFrame( animate );
        renderer.render( scene, camera );
        controls.update( );

    }

    </script>
    </html>
 
29.01.2020  
 




HofK
HofK (27.01.2020)
Tiempo schauen, si nun wirklich todos Fälle ordentlich behandelt son.


Lo findet se siempre todavía algo. 

Wenn uno una ( eventuell incluso schräg geschnittenen) Zylinder verschließen möchte, benötigt uno una Kreis (oder una Ellipse). Dabei muss el Teilung el Ränder natürlich absolut identisch ser. Man benötigt una extra Oberfläche surface: 'planecap', y ha en Iteration el para Zylinder identische Iteration a garantieren.

El Ellipse se por Angabe el Neigung definiert. Der Radius des Zylinders es entonces el kleine Halbachse, el große Halbachse es con el Neigung berechnet.
if ( g.surface ==='planecap' ){ // ellipse (circle) as bottom or top of a tilted (0) cut cylinder

    g.d = p.d !== undefined ? p.d : 2 * Math.sin( Math.PI / 24 );// to g.div4 default
    g.div4 = p.div4 !== undefined ? p.div4 : 6;// 6 * 4 = 24  divisions of associated cylinder
    g.tilt = p.tilt !== undefined ? p.tilt : 0;// tilt of adaption to the associated cylinder
    g.detail = g.div4 * 4;// division of the associated cylinder circle
    g.radius = g.d / Math.sin( Math.PI / g.detail ) / 2;// equals ellipse minor semi-axis for external use as well
    g.major = g.radius / Math.cos( g.tilt )// ellipse major semi-axis  for external use as well
    g.sintilt = Math.sin( g.tilt );
    g.costilt = Math.cos( g.tilt );

}




Und ya ergibt se una neue Anforderung. Der schräge Deckel benötigt una oder mehrere Löcher, en z.B. Zylinder con kleinerem Radius nahtlos anzuschließen. 

Yo denke, irgendwo muss Yo veces a la Schlussstrich ziehen, sonst se el una unendliche Geschichte. Das antes längerer Tiempo angefragte Atomioum es como Innengeometrie längst realisierbar.
 
02.02.2020  
 




p.specht

Usted bist:
Perfektionist!
 
XProfan 11
Computer: Gerät, daß es in Mikrosekunden erlaubt, 50.000 Fehler zu machen, zB 'daß' statt 'das'...
03.02.2020  
 




HofK
Un erste "fertige" Innengeometrie. Dort  [...]  veröffentlicht.



Ausprobieren:  [...] 

Das Gebilde innen y außen con ratón erkunden y el Schieber benutzen.

Un weitere Konstruktion. [...] 

 
06.02.2020  
 




HofK
Nun auch en GitHub en el Addon THREEi  [...] 
El Beispiele  [...]  [...] 

Lo son ahora de una three.js Nutzer una Verwendung des Zylinders con Löchern.  [...] 

Netzstrümpfe



Siehe  [...] 
 
07.02.2020  
 




p.specht

Endlich puede ser unterirdische Kanalsysteme geruchsfrei erkunden ! Wird lo auch bald 3D-Brillen para kleine graue Nagetiere geben?
 
XProfan 11
Computer: Gerät, daß es in Mikrosekunden erlaubt, 50.000 Fehler zu machen, zB 'daß' statt 'das'...
08.02.2020  
 




HofK
Lo son zuweilen Fehler. Offensichtlich, si a gewagte Lochkonstruktionen el Algorithmus überfordern. Er es sí eigentlich sólo para bastante "gediegene" implizite Flächen. El Löcher Yo con untergejubelt.



Dort algo dazu  [...] 

------------------------------------------------------------------------------------------------

Un Solución de prisoner849 kommt gerade a rechten Tiempo.  [...] 

Damit kann Yo el Geometrie nun zweifarbig hacer. Sieht igual viel mejor de.  [...] 

 
12.02.2020  
 




HofK
Für mi Innengeometrie benötigte Yo bisher no Texturen. Deshalb ha mich el hecho de, dass auch Firefox en el letzten Jahr el nachladen dieser Texturen en lokal geladenen html Páginas standardmäßig gesperrt ha, no así interessiert.

Como el Solución de prisoner849 aber Texturen erfordert, ha se el inmediatamente geändert. Gleichzeitig gab lo zwei Posts en discourse.  [...]   [...] 

Also Yo veces probiert. ( Siehe auch  [...]  )

Web Server para Chrome lief anfangs bien, habe ya gejubelt. Bis Yo plötzlich bemerkt habe, el el Inhalt no mehr aktuell war. Pensé, Yo otra vez veces falso programmiert, esta war lo siempre el alte Versión. Also beiseite gelegt, unsicherer Kandidat.

------------------------------------------------------------------------------------------------

node.js installiert  [...] 
Gut lesbar es  [...] 

Doch bastante aufwändig y kryptisch - Kommandozeilenbefehle ... no necesariamente qué para Principiante.

-----------------------------------------------------------------------------------------------------

Sicherheitseinstellungen des Browsers ändern.
Wenn uno sólo el gängigen Browsern arbeitet (lokale Tests y Internet) muss uno ständig ajustar, en en el Netz no ungeschützt a ser. Sehr gefährlich, si uno dazu todavía schusselig es - Yo.


La idea:
Lo son viele Spezialbrowser, el uno incluso no benötigt.
Wenn ellos z.B. en Firefox basieren, puede ser el Einstellungen dauerhaft festlegen y el Navegador sólo como lokalen Entwicklungsbrowser uso. Aufgrund ihres unterschiedlichen Erscheinungsbildes puede el Navegador no versehentlich verwechselt voluntad.

Yo habe sólo seamonkey  [...]  ausprobiert.

Wenn uno el Einstellung en offline setzt, merkt se el Navegador dies beim Neustart. Man muss se entonces no mehr por lo tanto kümmern.

Erlauben lokaler Texturen:
about:config ( en el Adressleiste ) - clic en "Ich bin me el Gefahr bewusst ( si sichtbar ) conjunto de privacy.file_unique_origin en falso

Der Eintrag privacy.file_unique_origin existierte sin embargo no. Pero esto es kein Problema:

Rechtsklick - Neu - Boolean
einfügen: privacy.file_unique_origin
OK y falso uso

Jetzt Yo mein Browserfenster con el Entwicklungsbeispiel y media Editor.
Yo speichere el Änderung y drücke F5 en el Navegador. Fertig, así simplemente como en alten Veces.
 
16.02.2020  
 




p.specht

Gute Concepto!

P.S.: Lässt se el gimbal lock  [...]  en el Ansichten irgenwie ausschalten? (Tuve el antes hm-zig Jahren veces por Übergang en otro Koordinaten o. Drehmatrizen gelöst - Programa desafortunadamente verschütt gegangen)
 
Computer: Gerät, daß es in Mikrosekunden erlaubt, 50.000 Fehler zu machen, zB 'daß' statt 'das'...
16.02.2020  
 




HofK
p.specht (16.02.2020)
Lässt se el gimbal lock  [...]  en el Ansichten irgenwie ausschalten?


El Antwort es en el angeführten Link [...] bajo Auflösung

"In Computermodellen, por ejemplo en dreidimensionalen Simulationen oder algunos Computerspielen, lässt se el problema por el Verwendung de Quaternionen umgehen. Un weitere Solución kann por Umrechnung el globalen Orientierungen en lokale Koordinatensysteme tener lugar, gerade si Quaternionen no hilfreich son."
 

Dazu Yo antes geraumer Tiempo una Demonstration gemacht. [...]  [...] 
 
21.02.2020  
 




p.specht

Mons. Olinde Rodrigues y Wiederentdecker Sir William Rowan Hamilton sei Dank!
 
XProfan 11
Computer: Gerät, daß es in Mikrosekunden erlaubt, 50.000 Fehler zu machen, zB 'daß' statt 'das'...
22.02.2020  
 




Respuesta


Título del Tema, max. 100 Signo.
 

Systemprofile:

Kein Systemprofil creado. [anlegen]

XProfan:

 Contribución  Font  Smilies  ▼ 

Bitte registro en una Contribución a verfassen.
 

Tema opciones

361.429 Views

Untitledvor 0 min.
iFVorgestern (03:02)
Walter15.06.2025
Paul Glatz23.05.2025
Uwe ''Pascal'' Niemeier23.03.2025
Más...

Themeninformationen



Admins  |  AGB  |  Applications  |  Autores  |  Chat  |  Política de Privacidad  |  Descargar  |  Entrance  |  Ayuda  |  Merchantportal  |  Pie de imprenta  |  Mart  |  Interfaces  |  SDK  |  Services  |  Juegos  |  Búsqueda  |  Support

Ein Projekt aller XProfan, el lo son!


Mi XProfan
Privado Noticias
Eigenes Ablageforum
Temas-Merkliste
Eigene Beiträge
Eigene Temas
Zwischenablage
Cancelar
 Deutsch English Français Español Italia
Traducciones

Política de Privacidad


Wir uso Cookies sólo como Session-Cookies wegen el technischen Notwendigkeit y en uns hay no Cookies de Drittanbietern.

Wenn du hier en unsere Webseite klickst oder navigierst, stimmst du unserer Erfassung de Informationen en unseren Cookies en XProfan.Net a.

Weitere Informationen a unseren Cookies y dazu, como du el Kontrolle darüber behältst, findest du en unserer nachfolgenden Datenschutzerklärung.


einverstandenDatenschutzerklärung
Yo möchte no Cookie