Как интегрировать / использовать yFiles для Html BPMN-редактора в интерфейсе React для редактирования диаграмм bpmn?

Question

Я работаю над приложением React-Python / Flask, которое получает входное изображение диаграммы bpmn от пользователя и через python скрипты преобразует его в файл bpmn, который затем можно загрузить через flask api на устройстве пользователя. Я работаю над реагирующим интерфейсом. Теперь мне нужно отредактировать диаграммы и применить к ним некоторую визуализацию. Так как же мне интегрировать yFiles для html BPMN-редактора в мое приложение? Я уже скачал ознакомительный пакет с yworks.com и интегрировал его в React после демонстрации. Но теперь я застрял, потому что не так много учебных пособий, доступных специально для yFiles с реакции. Когда я искал его, я нашел много уроков по bpmn. js с реагированием. Пожалуйста, помогите мне, как я могу go об этом. Я новичок в yFiles. Я изучил учебные пособия по пакету оценки yFiles и до сих пор не знаю, как go узнать об этом. Также я должен использовать yFiles только из-за требований клиента. Спасибо за любую помощь.

Answer 1

yFiles для HTML не является компонентом React - фактически это простой компонент JavaScript, который не основан на какой-либо сторонней платформе или даже программном обеспечении.

Это не означает, что вы не можете интегрировать его в React, или Angular, или Vue. js, или в любую другую клиентскую среду с хорошим поведением JavaScript. Фактически, yFiles был создан для поддержки интеграции во все эти фреймворки, и если он не работает с указанной c фреймворком, это обычно указывает на кратковременную или, скорее всего, ошибку в сторонней фреймворке, а не на в yFiles! Ведь yFiles - это просто: обычный JavaScript, который управляет частью вашего HTML5 DOM (один элемент div и все его дочерние элементы, если быть точным), несколько строк CSS, а остальные - просто JavaScript , Если ваша библиотека пользовательского интерфейса может обеспечить эти базовые c требования (и, конечно, React), yFiles можно настроить для работы с этой платформой.

Как вы сказали, существуют различные доступные примеры интеграции, которые показывают как интегрировать сторонние фреймворки и yFiles (как с yFiles в качестве «клиента», так и с yFiles, на котором размещены фрагменты DOM, созданные и поддерживаемые этими сторонними фреймворками: https://github.com/yWorks/yfiles-for-html-demos/tree/master/demos/toolkit

For React На GitHub есть дополнительное репо (которое не входит в состав оценочного пакета): https://github.com/yWorks/yfiles-react-integration-basic

Реагирует на то, как должно работать приложение или компонент. не придерживается подхода React (и я искренне верю, что это будет плохой идеей), но созданный вами компонент может. Идея состоит в том, чтобы создать собственный компонент React, который внутренне использует yFiles для HTML для визуализации, редактирование и обработка редактора BPMN, как если бы вы инкапсулировали нативный HTML5 tex tarea и две кнопки в компоненте React, вы инкапсулируете «div», который используется yFiles для управления визуализацией и редактором BPMN.

Демонстрация BPMN не использует React. На самом деле он использует старый HTML и не использует никакой реальной структуры для пользовательского интерфейса. Это означает, что вам нужно (и можно) взять этот код и обернуть его в пользовательский компонент React. С версией модуля узла yFiles для HTML и примером кода в стиле es6 это не должно быть слишком сложным. В конце концов, это просто JavaScript без каких-либо дополнительных зависимостей.

Никаких дополнительных руководств для yFiles в контексте React не существует. Однако это не должно быть большой проблемой, так как любой урок, который показывает, как обернуть универсальный c JavaScript компонент или как создать новый с нуля, должен быть применим.

Если вы столкнулись с конкретной проблемой c, опубликуйте свой вопрос здесь (если речь идет о React) или обратитесь в службу поддержки на yWorks, если вы уверены, что это проблема, указанная c для yFiles, а не общая проблема c JavaScript. Конечно, StackOverflow может работать и в случае с yFiles, однако, я думаю, что не так много разработчиков yFiles работают в StackOverflow. Во всяком случае, в большинстве случаев это я или кто-то из команды yWorks.