Like Tree1Danke
  • 1 Beitrag von CPoly
ERLEDIGT
NEIN
ANTWORTEN
11
ZUGRIFFE
1114
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
  1. #1
    Avatar von sight011
    sight011 ist offline Mitglied Diamant
    Registriert seit
    Jun 2007
    Beiträge
    2.135
    Hey Leute ich sitz gerade an einer Research-Aktion,

    ich versuch etwas darüber heraus zufinden in wie weit sich dreidimensionale Inhalte auf mobilen Devices darstellen lassen (vorrangig: iphone/ipad).

    http://mrdoob.github.com/three.js/ex...etry_cube.html

    Dieser Content lässt sich ohne Probleme auf dem iphone anzeigen. Jedoch lässt sich webgl-based Content nicht anzeigen, weil webgl noch nicht unterstützt wird.


    Ich hab es bereits geschafft geschafft 3D-Modelle über Blender als three.js Files zu exportieren.
    Und kann mir diese auch z.B. auf dieser Seite anzeigen lassen:

    http://blackjk3.github.com/threefab/


    Nur weiß ich noch nicht richtig, wie ich die Dateiin eine richtige html Seite einbaue!

    Eine Frage wäre auch ob, three.js --> "webgl based only" ist, weil dann würde es ja für das iphone nicht in Frage kommen?!

    Wie sieht es aus - teilt jemand sein Wissen?


    (

    Linksammlung:

    webgl erklärt:
    http://www.senaeh.de/einstieg-in-webgl-mit-three-js/

    testen ob dein verwendeter Browser WebGl unterstützt:
    http://analyticalgraphicsinc.github.com/webglreport/


    )



    laut der Quelle: "MozillaWiki" --> Canvas 3D has now become WebGL


    iOS Mobile Safari – WebGL is fully supported, but currently only for iAd customers. We expect WebGL to be fully enabled to all users at the same time that Apple enables it in desktop Safari.
    Geändert von sight011 (20.04.12 um 15:09 Uhr)
     
    Portfolio | Blog

    Dammm, ich hätte gerne die selbe Grafik-Engine wie Gott! :D
    Wer sich langweilt ist selber Schuld

  2. #2
    CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.713
    Zitat Zitat von sight011 Beitrag anzeigen
    Eine Frage wäre auch ob, three.js --> "webgl based only" ist, weil dann würde es ja für das iphone nicht in Frage kommen?!
    Der zweite Satz auf der three.js GitHub Seite lautet

    The library provides <canvas>, <svg> and WebGL renderers.
    https://github.com/mrdoob/three.js/

    Wenn du in three.js einsteigen willst: http://www.aerotwist.com/tutorials/g...with-three-js/

    Von WebGL zu Canvas zu wechseln ist so einfach wie "new THREE.WebGLRenderer();" durch "new THREE.CanvasRenderer();" zu ersetzen.

    Edit: Noch eine empfehlenswerte Seite: http://caniuse.com/#search=webgl , http://caniuse.com/#search=svg , http://caniuse.com/#search=canvas
     

  3. #3
    Avatar von sight011
    sight011 ist offline Mitglied Diamant
    Registriert seit
    Jun 2007
    Beiträge
    2.135
    Danke erstmal!


    The library provides <canvas>, <svg> and WebGL renderers.

    prinzipiell schon klar!

    Nur das Problem ist eigentlich eher was ist das -->

    http://mrdoob.github.com/three.js/ex...etry_cube.html


    denn:

    laut der Quelle: "MozillaWiki" --> Canvas 3D has now become WebGL
    Das was man zu sehen bekommt wenn man sich den oberen Link anschaut ist ja 3D (zumindest rein optisch!)!

    Nur wenn Canvas 3D Webgl ist -- dann eh frag ich mich was ist das mit der Box dann? Denn es wird mir ja auf dem Handy angezeigt!

    Schwierig zu versetehen - weißt Du was ich meine?



    EDIT: DEIN ANWAND HAT MIR IM DETIAL DOCH WEITER GEHOLFEN******

    Folgendes -- die svg Geschichten funktionieren ja auf dem iphone!

    Die Frage ist wie komplex man diese gestalten kann!

    Dieses geht z.B. auf dem iphone:

    http://www.lutanho.net/svgvml3d/functionplot.html

    aus dieser Libary:

    http://www.lutanho.net/svgvml3d/index.html


    bei diesen Beispielen sehe ich leiuder keine Texturen!
    Geändert von sight011 (20.04.12 um 19:44 Uhr)
     
    Portfolio | Blog

    Dammm, ich hätte gerne die selbe Grafik-Engine wie Gott! :D
    Wer sich langweilt ist selber Schuld

  4. #4
    CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.713
    Zitat Zitat von sight011 Beitrag anzeigen
    Das was man zu sehen bekommt wenn man sich den oberen Link anschaut ist ja 3D (zumindest rein optisch!)!

    Nur wenn Canvas 3D Webgl ist -- dann eh frag ich mich was ist das mit der Box dann? Denn es wird mir ja auf dem Handy angezeigt!
    Es spielt keine Rolle welcher Renderer benutzt wird. Auch der SVG und Canvas Renderer rendern 3D Objekte natürlich in 3D.

    Zitat Zitat von sight011 Beitrag anzeigen
    Folgendes -- die svg Geschichten funktionieren ja auf dem iphone!
    Genauso wie <canvas>.

    Zitat Zitat von sight011 Beitrag anzeigen
    Die Frage ist wie komplex man diese gestalten kann!
    Probiere es aus. Erstelle eine Machbarkeitsstudie zu deinem geplanten Projekt.
     

  5. #5
    Avatar von sight011
    sight011 ist offline Mitglied Diamant
    Registriert seit
    Jun 2007
    Beiträge
    2.135
    Ich werde es mit Canvas probieren. Schade ist bei dem Blender-Threejs-Exporter das ich nicht festlegen kann als was ich das ganze exportieren möchte ob: <canvas> <svg> oder WebGL

    Deswegen muss ich testen, was dabei nun wirklich raus kommt und wie ich das ganze in einer html Seite unterbringe!

    Aber deswegern frage ichg ja hier - vielleicht weiß das ja schon jemand


    Vielleicht geht es im Endeffekt nur über diesen Weg:

    (OpenGL)

    http://books.google.de/books?id=Nxyk...page&q&f=false
    Geändert von sight011 (20.04.12 um 20:13 Uhr)
     
    Portfolio | Blog

    Dammm, ich hätte gerne die selbe Grafik-Engine wie Gott! :D
    Wer sich langweilt ist selber Schuld

  6. #6
    CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.713
    Zitat Zitat von sight011 Beitrag anzeigen
    Ich werde es mit Canvas probieren. Schade ist bei dem Blender-Threejs-Exporter das ich nicht festlegen kann als was ich das ganze exportieren möchte ob: <canvas> <svg> oder WebGL

    Deswegen muss ich testen, was dabei nun wirklich raus kommt und wie ich das ganze in einer html Seite unterbringe!
    Du scheinst es noch nicht ganz verstanden zu haben. Three.js verwaltet intern die Szene, mit allen Objekten, Texturen, Lichtern etc. Jetzt kannst du diese Szene optional auch graphisch ausgeben lassen (wäre ansonsten etwas witzlos). Auf welche weise three.js diese Szene ausgibt (SVG, Canvas, etc.) spielt dabei keine Rolle, davon weiß die Szene ja nichts!

    Wie du das in die HTML Seite bringst, dazu solltest du schon JavaScript programmieren können. Ob es dafür auch fertige Codes gibt weiß ich nicht.
     

  7. #7
    Avatar von sight011
    sight011 ist offline Mitglied Diamant
    Registriert seit
    Jun 2007
    Beiträge
    2.135
    Auf welche weise three.js diese Szene ausgibt (SVG, Canvas, etc.) spielt dabei keine Rolle, davon weiß die Szene ja nichts!
    Wie meinst Du das genau?

    Durch die nicht spezifizierte Ausgabemöglichkeit, so dass ich angeben könnte SVG, canvas oder webgl - ergibt sich mir doch folgendes Problem -->


    Sobald Webgl verwendet wird läuft es nicht mehr auf Apples mobilen Endgeräten! Und genau dafür brauche ich es!
     
    Portfolio | Blog

    Dammm, ich hätte gerne die selbe Grafik-Engine wie Gott! :D
    Wer sich langweilt ist selber Schuld

  8. #8
    CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.713
    Du entscheidest in deinem Code doch selbst, welche Ausgabe verwendet werden soll.

    Siehe #2:

    Zitat Zitat von CPoly Beitrag anzeigen
    Von WebGL zu Canvas zu wechseln ist so einfach wie "new THREE.WebGLRenderer();" durch "new THREE.CanvasRenderer();" zu ersetzen.
    Du kannst sogar prüfen, ob WebGL vorhanden ist und dann entscheiden, was verwendet wird.

    Code javascript:
    1
    2
    3
    4
    5
    6
    7
    8
    9
    
    var webglSupported = ( function () { try { return !! window.WebGLRenderingContext && !! document.createElement( 'canvas' ).getContext( 'experimental-webgl' ); } catch( e ) { return false; } } )();
     
    var renderer;
     
    if(webglSupported) {
        renderer = new THREE.WebGLRenderer();;
    } else {
        renderer = new THREE.CanvasRenderer();
    }
    https://github.com/mrdoob/three.js/b...js/Detector.js
    sight011 bedankt sich. 

  9. #9
    Avatar von sight011
    sight011 ist offline Mitglied Diamant
    Registriert seit
    Jun 2007
    Beiträge
    2.135
    Das sind alles sehr hilfreiche Informationen!

    Dann stellen sich mir vorerst noch 3 Fragen:

    Wenn ich ein Auto in 3d habe (um das ich die kamera frei bewegen kann) - kann ich dann wirklich selbst entscheiden ob ich beispielsweise canvas oder webgl nutze? Oder ist nur webgl dazu im stande (ich bräuchte canvas )?

    Kann ich bei canvas auch Bilder als Texturen und HDRI als Umgebung verwenden?

    Hällst Du den GPU eines iphones für stark genung eine Autorotation zu bewerkstelligen?
     
    Portfolio | Blog

    Dammm, ich hätte gerne die selbe Grafik-Engine wie Gott! :D
    Wer sich langweilt ist selber Schuld

  10. #10
    CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.713
    Zitat Zitat von sight011 Beitrag anzeigen
    Wenn ich ein Auto in 3d habe (um das ich die kamera frei bewegen kann) - kann ich dann wirklich selbst entscheiden ob ich beispielsweise canvas oder webgl nutze? Oder ist nur webgl dazu im stande (ich bräuchte canvas )?
    Ja. Du schreibst die Software und du entscheidest welcher Renderer benutzt wird. Ob das mit dem Auto flüssig läuft, hängt natürlich von der Komplexität des Models und den Fähigkeiten des Gerätes ab. Wenn ich mir die Beispiele angucke, dann kann man auch mit dem CanvasRenderer ganz ansehnliche Sachen machen. http://mrdoob.github.com/three.js/

    Zitat Zitat von sight011 Beitrag anzeigen
    Kann ich bei canvas auch Bilder als Texturen und HDRI als Umgebung verwenden?
    Was Texturen angeht: Siehe Beispielseite (z.B. der Globus hat offensichtlich ein Bild als Textur). Wie die HDR Texturen technisch funktionieren weiß ich nicht, also kann ich dazu nichts sagen.

    Zitat Zitat von sight011 Beitrag anzeigen
    Hällst Du den GPU eines iphones für stark genung eine Autorotation zu bewerkstelligen?
    Ich bin mir nicht sicher ob es auf dem IPhone mittels GPU oder CPU berechnet wird. Aber davon abgesehen hängt das von diversen Faktoren ab. Du kannst ein Auto Model mit 1000 oder 1000000 Polygonen erstellen. Und die Textur kann Spiegelungen haben, es kann mehrere Lichtquellen mit Schatten geben. All das beeinflusst die Performance.


    Mir fehlt die Erfahrung, vor allem mit dem IPhone, um eine qualifizierte Aussage zu treffen.
     

  11. #11
    Avatar von sight011
    sight011 ist offline Mitglied Diamant
    Registriert seit
    Jun 2007
    Beiträge
    2.135
    Eine Frage in eine andere Richtung:

    Schon mal von der Umwandlung von 3D-Daten in XML gehört/wissen angehäuft!?

    Ist das perfomanter?
     
    Portfolio | Blog

    Dammm, ich hätte gerne die selbe Grafik-Engine wie Gott! :D
    Wer sich langweilt ist selber Schuld

  12. #12
    CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.713
    Ich verstehe die Frage nicht. Das "obj" Dateiformat ist z.B. XML und wird von three.js unterstützt. three hat außerdem sein eigenes Format (du verwendest ja bereits das Blender Plugin). Die beste Performance bekommst du zweifellos mit dem JSON format (https://github.com/mrdoob/three.js/w...del-format-3.0) ganz einfach weil das initiale Parsen der Modelle weg fällt.
     

Thema nicht erledigt

Ähnliche Themen

  1. Sun Research Java Tech Reports
    Von Thomas Darimont im Forum Java
    Antworten: 0
    Letzter Beitrag: 02.10.06, 18:00
  2. Programmierung von Mobile Web Devices
    Von llREAPERll im Forum Literatur
    Antworten: 0
    Letzter Beitrag: 14.03.05, 12:52
  3. Arbeiten mit Frames auf Mobile devices
    Von renieh im Forum Swing, Java2D/3D, SWT, JFace
    Antworten: 0
    Letzter Beitrag: 22.02.05, 23:08
  4. Operation Research Gantt Diagramm
    Von Gani im Forum Smalltalk
    Antworten: 5
    Letzter Beitrag: 01.03.04, 17:11