Comment insérer model-viewer ?

Hi

We have a self hosted discourse for our startup. We are having to view and analyze 3d models as part of our workflow. Model-viewer gives a very simple 360 degree possibility of 3d models. It just takes a CSS, JS and few lines of html as below.

<!-- 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>

I can customize discourse to include js and css, but how could I use above html to embed? As I learn, the div is banned, and I could not find anything about how to use model-viewer html tag at all here.

After all this, my idea is to upload glb file to discourse in editor, use that link for src tag of model-viewer, to get it embedded as interactive 3d.

Kindly advice.

1 « J'aime »

At first glance, this reads like plugin territory, you may have to develop something custom for this.

1 « J'aime »

Si quelqu’un d’autre tombe sur ce sujet (comme je l’ai fait) en cherchant sur Google « visionneuse de modèles 3D Discourse », j’ai maintenant créé un composant de thème qui prend en charge cela, donc aucun plugin n’est nécessaire. Vous pouvez trouver les détails du composant et les instructions sur la façon de l’utiliser dans la catégorie Composant de thème à Insérer Modèle 3D.

4 « J'aime »