كيفية إدراج 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)

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

إعجاب واحد (1)

إذا صادف أي شخص آخر هذا الموضوع (كما فعلت) عند البحث في جوجل عن “عارض نماذج ثلاثية الأبعاد لـ Discourse” ، فقد قمت الآن بإنشاء مكون سمة يدعم ذلك ، لذلك لا يلزم وجود مكون إضافي. يمكنك العثور على تفاصيل المكون وتعليمات حول كيفية استخدامه في فئة مكونات السمة في إدراج نموذج ثلاثي الأبعاد.

4 إعجابات