Перейти к основному содержимому

Viewer3D

Отображает 3D-модель

Позволяет визуализировать 3D-модели и выполнять с ними различные операции, например, следующие:

  • вращение;
  • масштабирование;
  • смена проекции;
  • сечения по плоскостям.

Свойства​

AccessToken​

Токен доступа к 3D-модели

Тип: undefined

AddAnnotations​

Добавление объектов на сцену { value: [] }

Тип: object

AddComment​

Свойство для обратной совместимости. Не рекомендуется использовать. Комментарий к выбранному объекту 3D-модели

Тип: string

AddCuttingPlanes​

Добавление сечений на сцену { value: [] }

Тип: object

AddDimension​

Включение режима сцены для добавления точек измерения расстояния на выбранных объектах 3D-модели

Тип: number

AddLightSource​

Добавление точки освещения

Тип: object

AddNote​

Комментарий к выбранному объекту 3D-модели

Тип: object

Значение по умолчанию: <pre>{
"value": ""
}</pre>

ApiSubPath​

Дополнительный путь к API 3D-сервиса. Используется для совместимости с предыдущими версиями Платформы.

Тип: string

Значение по умолчанию: /

BackendPath​

URL-адрес бэкенд-сервиса 3D

Тип: string

Badge​

Количественная информация в компонентах Menu, Accordion, Link, Text.

В качестве значения может использоваться объект с полями: counter (число), position ("post" или "pre"), color (цвет)

Тип: any

CSS​

Массив строк-классов CSS-стилей, описанных в файле CSS.css разрабатываемого проекта или встроенных CSS-стилей Платформы.

Пример:

// внешние (m) и внутренние (p) отступы для компонента. Число после символа "-" (в этом примере - 4) должно быть кратно величине, указанной в параметре, определяющем кратность отступов, в файле Style.mdtheme разрабатываемого проекта.
CSS={["m-4", "p-4"]}

Тип: array

CameraControls​

Массив настроек вращения камеры, например, { value: ["Pan", "Zoom", "Orbit", "Rotation"] }. Элементы массива могут иметь следующие значения:

  • Pan: перемещение в плоскости камеры;
  • FreeRotation: свободное вращение вокруг объекта;
  • Orbit: вращение объекта;
  • Rotation: вращение вокруг объекта;
  • Zoom: приближение к объектам.

Тип: object

Значение по умолчанию: <pre>{}</pre>

CameraOrientation​

Ориентация камеры. Свойство используется для обратной совместимости. Не рекомендуется использовать.

Тип: enum

Возможные значения:

Down - снизу Front - спереди ISO - изометрически Left - слева Rear - сзади Right - справа Up - сверху

  • Значение для инициализации по умолчанию

CameraPosition​

Ориентация камеры: снизу: { value: Down }, спереди: { value: Front }, слева: { value: Left }, сзади: { value: Rear }, справа: { value: Right }, сверху: { value: Up }, изометрически: { value: ISO }

Тип: object

Значение по умолчанию: <pre>{
"value": ""
}</pre>

CameraProjection​

Проекция камеры. Свойство используется для обратной совместимости. Не рекомендуется использовать.

Тип: enum

Возможные значения:

Orthogonal - Ортогональная Perspective - Перспективная

  • Значение для инициализации по умолчанию

CameraView​

Проекция камеры: Параллельная: { value: Orthogonal, }, Перспективная: { value: Perspective, }

Тип: object

Значение по умолчанию: <pre>{
"value": ""
}</pre>

CaptureEvent​

Событие сдвига камеры после однократной установки точки обзора

Тип: undefined

ChangeBackground​

Изменить цвет фона ({ value: { fColor: "#FFFFFF", sColor: "#FFFFFF" }})

Тип: object

ColorElements​

Окрашивание элементов по UUID

Тип: array

CombineConfig​

Служебное свойство, используемое в визуальном режиме Редактора Форм, для присваивания значений свойствам компонента в виде генерируемых блоков кода. Запрещено изменять значение.

Тип: object

CuttingPlane​

Сечение по точкам. Свойство используется для обратной совместимости. Не рекомендуется использовать.

Тип: enum

Возможные значения:

OnePointPlaneXY - По одной точке XY OnePointPlaneXZ - По одной точке XZ OnePointPlaneYZ - По одной точке YZ ThreePointSlice - По трем точкам

  • Значение для инициализации по умолчанию

CuttingPlanesColors​

Тип: object

Значение по умолчанию: <pre>{
"transparent": 0.3,
"rect": "#0000ff",
"lines": "#0000ff"
}</pre>

Direction​

Настройки привязки линейки с фиксацией оси, например, { x: 1, y: 0, z:0 }.

Тип: object

DisplayingObjects​

Скрытие или отображение объектов: Скрытие выбранных объектов: { value: HideSelected }, Отображение выбранных объектов: { value: ShowSelected }, Отображение всех объектов: { value: ShowAll }

Тип: object

Значение по умолчанию: <pre>{
"value": ""
}</pre>

DisplayingObjectsIds​

Отображение выбранных объектов ["someId1", "someId2"] или отображение всех объектов ["*"]

Тип: array

DivToRenderId​

Идентификатор html-элемента, в котором отрисовывается сцена

Тип: undefined

DynamicLoad​

Тип: boolean

Значение по умолчанию: True

EditCuttingPlane​

Редактирование сечения по Id, пример передачи параметров: { planeId: number, options?: { placement?: { a: number; b: number; c: number; }; colors?: { lines: C3DViewRGB; rect: C3DViewRGB; transparent: number; }; direction?: "front" | "back"; centering?: boolean; } }).

Тип: object

EnableBackground​

Тип: boolean

Значение по умолчанию: True

Hidden​

Признак состояния компонента Скрыт.

Тип: boolean

HiddenObjectsIds​

Скрытие выбранных объектов ["someId1", "someId2"] или скрытие всех объектов ["*"]

Тип: array

HighlightColor​

Тип: string

Значение по умолчанию: #e1decd

HighlightCuttingPlaneId​

Свойство для обратной совместимости. Не рекомендуется использовать. Идентификатор подсвечиваемого сечения.

Тип: string

HighlightPlaneMode​

Свойство для обратной совместимости. Не рекомендуется использовать. Триггер для вызова подсвечивания сечения с идентификатором HighlightCuttingPlaneId

Тип: number

Hint​

Текст, отображаемый при наведении указателя мыши на компонент. Текст отображается на белом фоне

Тип: any

Hostname​

Имя узла сервиса 3D

Тип: string

Id​

Идентификатор компонента для навигации к нему на HTML-странице. Подробнее см. HTML id Attribute или ID

Тип: string

IdToClose​

Идентификатор закрываемой 3D-модели

Тип: string

IdToOpen​

Идентификатор открываемой 3D-модели

Тип: string

IsolatedObjects​

Отображение изолированных объектов ["UUID1", "UUID2"]

Тип: array

OnAddAnnotation​

Обработчик события после добавленния объекта на сцену

Тип: undefined

OnClick​

Обработчик события нажатия левой кнопки мыши, когда указатель мыши находится на компоненте.

В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnClick={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnCtrlOriginChangedCuttingPlane​

Обработчик события изменения свойства centered сечения, (centered: boolean) => void

Тип: undefined

OnCuttingPlane​

Обработчик события добавления сечения по точкам

Тип: undefined

OnFPS​

Тип: undefined

OnGetAnnotations​

Обработчик события для получения всех объектов, добавленных на сцену

Тип: undefined

OnGetLightSources​

Обработчик события добавления точки освещения

Тип: undefined

OnGettingCuttingPlanes​

Обработчик события для получения всех сечений, добавленных на сцену

Тип: undefined

OnInitialize​

Обработчик события инициализации компонента, возвращающий объект initResult

Тип: undefined

OnInvertCuttingPlane​

Обработчик события изменения направления сечения, (value: "front" | "back") => void

Тип: undefined

OnItemsSelect​

Обработчик события выбора объектов 3D-модели. Возвращает массив GUID-объектов модели на сцене.

Тип: undefined

OnKeyDown​

Обработчик события нажатия любой клавиши клавиатуры. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа KeyboardEvent.

Пример:

OnKeyDown={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnKeyUp​

Обработчик события отпускания любой клавиши клавиатуры. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа KeyboardEvent.

Пример:

OnKeyUp={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnLightSourcesChanged​

Тип: undefined

OnMouseDown​

Обработчик события нажатия любой кнопки мыши, когда указатель мыши находится на компоненте. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnMouseDown={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnMouseEnter​

Обработчик события перемещения указателя мыши на компонент. Событие срабатывает только в случае, если указатель мыши находится за пределами компонента и пользователь перемещает указатель мыши внутрь компонента. Если указатель мыши в текущий момент находится внутри компонента, для срабатывания события пользователь должен переместить указатель мыши за пределы компонента, а затем обратно внутрь компонента. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnMouseEnter={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnMouseLeave​

Обработчик события перемещения указателя мыши за пределы компонента. Событие срабатывает, только если указатель мыши находится внутри компонента, а пользователь перемещает указатель мыши за пределы компонента. Если указатель мыши в текущий момент находится за пределами компонента, для срабатывания события пользователь должен переместить указатель мыши внутрь компонента, а затем обратно за пределы компонента. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnMouseLeave={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnMouseMove​

Обработчик события наведения указателя мыши на компонент. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnMouseMove={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnMouseOut​

Обработчик события перемещения указателя мыши за пределы компонента. Когда пользователь наводит указатель мыши на компонент, происходит одно событие MouseOver, за которым следует одно или несколько событий MouseMove, когда пользователь перемещает указатель мыши внутри компонента. Одно событие MouseOut возникает, когда пользователь выводит указатель мыши за пределы компонента. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnMouseOut={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnMouseOver​

Обработчик события перемещения указателя мыши на компонент. Событие возникает, когда пользователь наводит указатель мыши на компонент, и не повторяется до тех пор, пока пользователь не выведет указатель мыши за пределы компонента и затем не вернет его обратно. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnMouseOver={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnMouseUp​

Обработчик события отпускания кнопки мыши, когда указатель мыши находится на компоненте. В качестве параметра принимает объект типа объект события компонента экранной формы с дополнительными полями типа MouseEvent.

Пример:

OnMouseUp={() => {
  // Получение параметра события
  const event = getEvent();
  // Вывод параметра события в консоль браузера
  console.log(event);
  }
}

Тип: undefined

OnNumberTriangles​

Тип: undefined

OnSaveView​

Обработчик события для добавления точек обзора

Тип: undefined

OnUnmount​

Обработчик события размонтирования согласно жизненному циклу экранной формы. Не имеет параметров.

Пример:

OnUnmount={() => {
  // Отмена выполнения периодического действия при размонтировании экранной формы
    return clearInterval(getValue("pleerInterval"))
  }
}

Тип: undefined

OnUpdateCuttingPlane​

Обработчик события изменения координат сечения, (a: number, b: number, c: number) => void

Тип: undefined

PlaneSlice​

Сечение по точкам: По одной точке XY: { value: "OnePointPlaneXY", direction: "front" }, По одной точке XZ: { value: "OnePointPlaneXZ", direction: "front" }, По одной точке YZ: { value: "OnePointPlaneYZ", direction: "front" }, По трем точкам: { value: "ThreePointSlice", direction: "front" }

Тип: object

Значение по умолчанию: <pre>{
"value": ""
}</pre>

Port​

Порт сервиса 3D

Тип: string

Print3DImage​

Печать 3D-изображения

Тип: number

Protocol​

Протокол, который использует сервис 3D

Тип: string

Значение по умолчанию: https

RebuildModel​

Триггер для вызова команды принудительной перестройки сцены

Тип: number

RemoveComments​

Свойство для обратной совместимости. Не рекомендуется использовать. Триггер для вызова команды удаления комментария с выбранных объектов 3D-модели

Тип: number

RemoveCommentsIds​

Массив идентификаторов комментариев, которые должны быть удалены. Пример: ["someId1", "someId2"]

Тип: array

RemoveCuttingPlane​

Удаление сечения с идентификатором RemoveCuttingPlaneId

Тип: number

RemoveCuttingPlaneId​

Идентификатор удаляемого сечения

Тип: string

RemoveDimensions​

Удаление указателей для измерения расстояния с выбранных 3D-моделей

Тип: number

RemoveDimensionsIds​

Массив идентификаторов указателей (измерения расстояний на 3D-моделях), которые должны быть удалены. Пример: ["someId1", "someId2"]

Тип: array

RemoveLightSourceId​

Удаление точки освещения

Тип: number

RenderMode​

Тип отображения сцены, например, { value: "shaded" }., Может иметь следующие значения:

  • shaded: отображаются только поверхности модели;
  • wireFrame: отображаются только ребра модели;
  • shadedAndWireFrame: отображаются поверхности и ребра модели.

Тип: object

Значение по умолчанию: <pre>{}</pre>

ResetHighlightPlaneMode​

Удаление подсветки сечений

Тип: number

SavingImageFileName​

Имя файла для сохранения 3D-изображения, например, { value: "screen-shot.png" }

Тип: object

SelectByColor​

Выбор объектов с одинаковым цветом ({ value: "#FFFFFF" })

Тип: object

SelectByOpacity​

Выбор объектов с одинаковой прозрачностью

Тип: number

SelectedObjects​

Выбранные объекты 3D-модели.

Тип: array

SelectionColor​

Тип: string

Значение по умолчанию: #fdec04

ServiceName​

Имя сервиса 3D

Тип: string

Значение по умолчанию: integration3d

SetLightSourceOn​

Включение/выключение всех точек освещения

Тип: boolean

Значение по умолчанию: True

SetLightSources​

Добавление точек освещения

Тип: object

SetViewPoint​

Установка камеры в передаваемую точку обзора ({view: savedOrientation, duration: 1000}).

Тип: object

Show3DComponent​

Тип: boolean

Значение по умолчанию: True

Slot​

Именованное пространство во фрагменте экранной формы или именованное пространство в шаблоне компонента с возможностью шаблонизации, например, Select, DataGrid.

Тип: string

SurfaceInterpretation​

Признак включения режима отображения поверхности объекта

Тип: boolean

Tolerance​

Радиус в пикселях для поиска ближайших точек

Тип: number

Tooltip​

Текст, отображаемый при наведении указателя мыши на компонент. Текст отображается на черном фоне.

Тип: any

TraceId​

Идентификатор для отслеживания состояния компонента исходя из жизненного цикла экранной формы. Используется для выполнения фрагмента кода по изменению состояния компонента

Тип: string

TriggerFetchAndUpdateLights​

Тригерр для вызова обработчика события по получению точек освещения, добавленных на сцену

Тип: number

TriggerFetchAndUpdateView​

Инкремент делегата для запуска внешней функции компонента Viewer3d (getView)

Тип: number

TriggerGetAnnotations​

Тригерр для вызова обработчика события по получению всех объектов, добавленных на сцену

Тип: number

TriggerGetCuttingPlanes​

Тригерр для вызова обработчика события по получению сечений, добавленных на сцену

Тип: number

UnloadLoadedModels​

Признак очистки 3D-модели, загруженной перед добавлением новой 3D-модели в рабочую область

Тип: boolean

UseLogger​

Признак записи в журнал команд, переданных в API C3D Viewer. Информация журнала также записывается консоль браузера.

Тип: boolean

ViewMode​

Режим отображения сцены

Тип: enum

Значение по умолчанию: selection

Возможные значения:

selection - Режим выбора объектов на сцене default - Режим по умолчанию

VisibilityObjects​

Скрытие или отображение выбранных элементов. Свойство используется для обратной совместимости. Не рекомендуется использовать.

Тип: enum

Возможные значения:

HideSelected - Скрытие выбранных объектов ShowSelected - Отображение выбранных объектов ShowAll - Отображение всех скрытых объектов

  • Значение для инициализации по умолчанию

Visible​

Признак инверсии состояния компонента Скрыт.

Тип: boolean

Значение по умолчанию: True

ZoomFitAll​

Масштабирование всех объектов 3D-модели согласно размеру сцены.

Тип: number

ZoomFitObjects​

Масштабирование переданных объектов 3D-модели согласно размеру сцены.

Тип: array

ZoomFitSelected​

Масштабирование выбранных объектов 3D-модели согласно размеру сцены.

Тип: number

Примеры​

Скрипты:


      setState({
         triggerFetchAndUpdateView: 0,
         viewPointsArray: [],
         selectedViewPoint: undefined,
         triggerGetAnnotations: 0,
         allAnnotations: [],
         triggerGetCuttingPlanes: 0,
         allCuttingPlanes: []
      })

JSX:

<Group >
  <Viewer3D 
    ServiceName="c3dservice/" 
    BackendPath="/c3drpc"
    AccessToken={()=>"Bearer " + getToken()}
  />
</Group>