Обзор
Сервис предлагает два варианта для интеграции 3d-конструктора на сайт - через iframe и через JS API:
Iframe-метод является простейшим механизмом, и не предполагает никаких взаимодействий со встраиваемым сайтом, кроме как обратного вызова при отправке заказа.
Интеграция через скрипт позволяет полностью взаимодействовать 3d-конструктором через JS API.
Общие сведения и понятия
Товар
Для возможности работы 3d-конструктора, через личный кабинет создаются «товары». В товар загружается одна или несколько 3d-моделей формата .dae или .json (ThreeJS Scene). Товар может принадлежать одной или нескольким категориям заданных в личном кабинете.
Приложение
Приложение - это набор настроек, с помощью которых будут отображаться товары в 3d-конструкторе. Для приложения указывается домен, только на этот домен возможно будет встроить 3d-конструктор. В приложении настраивается список категорий товаров, которые разрешено будет открывать, выбрать можно любую свою категорию, либо публичную с разрешения владельца. Также в приложении настраивается набор пользовательских полей, с помощью которых можно отправлять пользовательское нанесение в виде заказа.
Типы нанесения
Типы нанесения настраиваются в личном кабинете. Для каждого типа нанесения можно заполнить несколько опций-«цветностей». Для каждой цветности можно указать ограничения в цветах, и зафиксировать палитру ограниченной цветности. Если таковые указаны, то в процессе добавления изображений на слой с выбранной цветностью, цвета на этих изображениях будут автоматически уменьшены до указанного значения.
Места нанесения и слои
На модели специальным образом отмечают доступные места нанесения. Для каждого места указывается, типы и цветности нанесений, можно указать связанный ракурс. В случае если для места нанесения его расположение, площадь или форма различается в зависимости от типа нанесения, можно сделать составное из нескольких областей место. Для этого одна из областей делается основной, а для останых указывается "основная зона".
Пользователь может наносить на место нанесение множество слоёв. Типов слоёв два - текстовый и изображение.
Состояния товара
Товар может состоять из нескольких разных или одинаковых моделей, например, набор из термоса, двух кружек и сумки состояит из трёх моделей - термоса, кружки и сумки.
Для расположения загруженных моделей на сцене, создаётся «состояние». С помощью состояний можно различным образом переключать расположение загруженных моделей. А также задавать, является ли нанесение единым или раздельным для одинаковых моделей.
Ракурсы
Ракурс - это предустановленно расположение камеры относительно сцены. Также для ракурса указывается состояние, поэтому при переключении ракурса можно переключать и состояние. Для ракурса можно задать связанное место нанесение, так, что при активации ракурса будет автоматически активироваться соответствующее место нанесеня.
В случае 2D-рендеринга ракурсы - это единственная возможность переключать вид изделия.
Варианты товара
Для каждого товара можно задать несколько групп вариаций товара, например, по цвету корпуса и цвету верхней части. Для каждой комбинации можно указать артикул, с помощью которой можно идентифицировать товар.
Каждая вариация может менять цвета и текстуры на 3d модели произвольным образом.
Пользовательские поля
Для приложения указывается набор пользовательских полей. Это текстовые поля, выпадающие меню, флажки, кнопки и другие элементы. Поля могут быть как глобальные для всего пользовательского заказа, так и зависеть от конкретного места нанесения.
Оформление заказа
Для сохранения пользовательского нанесения необходимо оформить «заказ». Под заказом здесь имеется в виду польное сохранение состояния пользовательского нанесения.
При оформлении заказа на 3d-нанесение, ему выдаётся ID-заказа и две хэш строки - на просмотр и редактирование. С помощью этих данных можно повторно открыть оформленный пользователем заказ для просмотра или редактирования соответственно.
С чего начать?
Для того, чтобы внедрить 3d-визуализатор на сайт, необходимо:
Получить логин-пароль от личного кабинета сервиса ( https://my.o3d.oasiscatalog.com ).
Создать приложение и указать доступные ему домены и категории товаров.
Внедрить на свой сайт ссылку на сконфигурированный товар через iframe или скрипт.
Настроить URL для принятия данных сформированного заказа (для iframe), или реализовать свой механизм принятия данных (через JS API)
Last updated