Come inserire model-viewer?

Ciao

Abbiamo un Discourse self-hosted per la nostra startup. Dobbiamo visualizzare e analizzare modelli 3D come parte del nostro flusso di lavoro. Model-viewer offre una semplice possibilità di visualizzazione a 360 gradi dei modelli 3D. Richiede solo un CSS, un JS e poche righe di HTML come mostrato di seguito.

<!-- Importa il componente -->
<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>

<!-- Usalo come qualsiasi altro elemento HTML -->
<model-viewer src="shared-assets/models/Astronaut.glb" alt="Un modello 3D di un astronauta" auto-rotate camera-controls></model-viewer>

Posso personalizzare Discourse per includere JS e CSS, ma come potrei usare l’HTML sopra per incorporare il modello? Ho letto che il tag div è vietato e non ho trovato nulla su come utilizzare il tag HTML model-viewer qui.

L’idea finale è caricare il file GLB su Discourse nell’editor, utilizzare quel link per l’attributo src del tag model-viewer e incorporarlo come modello 3D interattivo.

Vi chiedo gentilmente un consiglio.

1 Mi Piace

A prima vista, sembra rientrare nel campo dei plugin; potrebbe essere necessario sviluppare qualcosa di personalizzato per questo.

1 Mi Piace

Se qualcun altro si imbatte in questo argomento (come è successo a me) cercando su Google ‘Discourse 3D model viewer’, ho ora creato un componente tematico che lo supporta, quindi non è necessario alcun plugin. Puoi trovare i dettagli del componente e le istruzioni su come usarlo nella categoria Componente tematico su Insert Model 3D.

4 Mi Piace