Как добавить model-viewer?

Поддержка
1

Привет

У нас есть саморазмещённый Discourse для нашего стартапа. В рамках рабочего процесса нам необходимо просматривать и анализировать 3D-модели. Model-viewer предоставляет очень простое решение для просмотра 3D-моделей в 360 градусов. Для этого достаточно подключить CSS, JS и добавить несколько строк HTML, как показано ниже.

<!-- Импорт компонента -->
<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>

<!-- Использование как любого другого HTML-элемента -->
<model-viewer src="shared-assets/models/Astronaut.glb" alt="3D-модель астронавта" auto-rotate camera-controls></model-viewer>

Я могу настроить Discourse так, чтобы он включал JS и CSS, но как мне внедрить приведённый выше HTML? Насколько я знаю, тег <div> запрещён, а информации о том, как использовать HTML-тег model-viewer, я нигде не нашёл.

Моя идея заключается в следующем: загрузить файл .glb в редакторе Discourse, использовать полученную ссылку в атрибуте src тега model-viewer и таким образом встроить интерактивную 3D-модель.

Буду благодарен за советы.

2

На первый взгляд, это звучит как задача для плагина — возможно, вам придётся разработать что-то кастомное.

3

Если кто-то еще наткнулся на эту тему (как и я), ища в Google «Discourse 3D model viewer», то я создал компонент темы, который поддерживает эту функцию, поэтому плагин не требуется. Подробную информацию о компоненте и инструкции по его использованию вы найдете в категории «Компоненты тем» по ссылке Вставка 3D-модели.