bitWorking

CSS 3D Engine


 8. Juli 2014  3D, JavaScript


Gerade habe ich meine CSS 3D Engine auf GitHub veröffentlicht. Es ist eine in JavaScript programmierte Library, die keine Abhängigkeiten zu anderen Libraries hat. Im Gegensatz zu anderen CSS 3D Engines wird der IE10 komplett unterstützt. Erreicht wird das dadurch, dass für jedes Element eine eigene Matrix errechnet wird.

Ein Beispiel: http://css3d.bitworking.de/examples/example04.html

Die Homepage findet ihr hier: http://css3d.bitworking.de/

Die GitHub Seite hier: https://github.com/bitworking/CSS3D



  • Mauricio Pellegrinetti 4. Oktober 2018 17:48

    Hi. I´m playing with the „css 3d engine“ and it works really well! Congratz! Nicely done!
    I´m still reading the documentation and trying to understand some aspects.
    I´m using a 3D model in .obj file and I was wondering if it would be possible to render triangles.
    I imagine you have moved on to other things, since there were no update since 2014, and I don´t mean to bother you but I would really appreciate if you could tell me if triangle rendering is possible or if there´s no point in trying.

    Heres´s my attempt on doing it: http://www.ensambl.io/pruebas/CSS3D-master/examples/example02_mod.html

    Anyway, it´s a fine job you´ve done!
    Thank you.

    Antworten
    • Jan 6. Oktober 2018 00:57

      Hi Mauricio, nice that you tried it out. The project is indeed a little bit old and I had no time to really bring it to production level. It was just an experiment to see what’s possible with CSS 3D. Unfortunately there are no triangles possible because every face is just a normal div element in the end. You perhaps could fake it with some clever transparent png texture mapping.

      Today I probably would use THREE.js or a similar library for 3D on the web. Have you seen that THREE.js also has a CSS renderer? But I don’t know if it supports triangles.

      Thanks for the comment.

      Antworten

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.