Как правильно отобразить файл .dwg в веб-приложении Reactjs

В настоящее время я хочу отобразить большой .dwg файл в веб-приложении reactjs, .dwg файл будет получен с моего django сервера. Также я буду выполнять некоторую фильтрацию файла .dwg, чтобы показать координаты различных IoT-устройств.

После нескольких часов исследований я обнаружил, что есть два способа показать файл .dwg в веб-приложении reactjs. Либо использовать расширение autodesk forge viewer в reactjs, однако существует мало руководств о том, как реализовать это шаг за шагом. Другим решением является преобразование файла .dwg в файл .dxf и отображение его в веб-приложении.

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

Python предназначен для бэкенда, а react.js работает на фронт-энде, так что нет ничего особенного по сравнению с другими приложениями Forge Viewer. Вы можете поместить его в Django view с моими ограниченными знаниями о фреймворке Django.

Вам просто нужно обернуть Forge Viewer в компонент React, затем отрендерить и смонтировать его в DOM. Кроме того, перед использованием Forge Viewer, вам необходимо вызвать Model Derivative API's POST job для перевода вашего DGW в SVF, а затем передать закодированный в base64 URN в реакт-компонент Viewer. Вот реакт-компонент Forge Viewer для демонстрации, а также учебник по использованию Model Derivative API

https://github.com/yiskang/forge-viewer-react-component-demo/blob/main/src/Viewer.jsx

BTW, для преобразования DWG в SVF, здесь есть разница в конфигурации задания для DWG, так как это не заархивированный файл

curl  -X POST \
      'https://developer.api.autodesk.com/modelderivative/v2/designdata/job' \
      -H 'Content-Type: application/json' \
      -H 'Authorization: Bearer <YOUR_ACCESS_TOKEN>' \
      -H 'x-ads-force: true' \
      -d '{
          "input": {
              "urn": "<BASE64_ENCODED_URN_OF_SOURCE_FILE>",
          },
          "output": {
              "formats": [
                  {
                      "type": "svf",
                      "views": [
                          "2d",
                          "3d"
                      ]
                  }
              ]
          }
      }'
Вернуться на верх