Wie man model-viewer einfügt?

Unterstützung
1

Hallo

Wir nutzen ein selbst gehostetes Discourse für unser Startup. Im Rahmen unseres Workflows müssen wir 3D-Modelle betrachten und analysieren. Model-viewer bietet eine sehr einfache Möglichkeit, 3D-Modelle in 360 Grad darzustellen. Es werden lediglich CSS, JS und ein paar Zeilen HTML benötigt, wie unten gezeigt.

<!-- Import the component -->
<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>

<!-- Use it like any other HTML element -->
<model-viewer src="shared-assets/models/Astronaut.glb" alt="A 3D model of an astronaut" auto-rotate camera-controls></model-viewer>

Ich kann Discourse anpassen, um JS und CSS einzubinden, aber wie kann ich das obige HTML zur Einbettung verwenden? Wie ich erfahren habe, ist das

-Tag verboten, und ich konnte hier überhaupt nichts darüber finden, wie man das -HTML-Tag verwendet.

Meine Idee ist es, eine GLB-Datei im Discourse-Editor hochzuladen, diesen Link für das src-Attribut von Model-viewer zu verwenden und es so als interaktives 3D-Modell einzubetten.

Ich bitte um Rat.

1 „Gefällt mir“
2

Auf den ersten Blick klingt das nach Plugin-Bereich; möglicherweise müssen Sie etwas Individuelles dafür entwickeln.

1 „Gefällt mir“
3

Sollte jemand anderes auf dieses Thema stoßen (wie ich), wenn er nach ‘Discourse 3D model viewer’ googelt, dann habe ich jetzt eine Theme-Komponente erstellt, die dies unterstützt, sodass kein Plugin erforderlich ist. Details zur Komponente und Anweisungen zur Verwendung finden Sie in der Kategorie Theme Component unter Insert Model 3D.

4 „Gefällt mir“