https://github.com/process-analytics/bpmn-visualization-pm4py
Example of integration between bpmn-visualization and pm4py
https://github.com/process-analytics/bpmn-visualization-pm4py
bpmn conformance-checking demo example integration low-quality pm4py process-discovery process-mining python visualization
Last synced: about 2 months ago
JSON representation
Example of integration between bpmn-visualization and pm4py
- Host: GitHub
- URL: https://github.com/process-analytics/bpmn-visualization-pm4py
- Owner: process-analytics
- License: gpl-3.0
- Created: 2023-01-16T09:56:59.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-01-13T16:20:59.000Z (4 months ago)
- Last Synced: 2025-01-13T17:27:58.512Z (4 months ago)
- Topics: bpmn, conformance-checking, demo, example, integration, low-quality, pm4py, process-discovery, process-mining, python, visualization
- Language: JavaScript
- Homepage:
- Size: 5.52 MB
- Stars: 12
- Watchers: 2
- Forks: 7
- Open Issues: 16
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Integration between `bpmn-visualization` and `pm4py`
| Archived on 2024-01-13 | We no longer use this repository. |
| -------- | -------- |This is an example integration between [bpmn-visualization](https://github.com/process-analytics/bpmn-visualization-js/) and [PM4PY](https://github.com/pm4py).
## Architecture
The application consists of two main components: the frontend written in JavaScript and the backend written in Python.
* The frontend uses **bpmn-visualization** to visualize the BPMN process model and the statistics data over it.
* The backend is built using **pm4py** which processes data to perform process discovery and conformance checking. The results are then communicated to the frontend through [Flask](https://flask.palletsprojects.com/) and [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API).In addition to bpmn-visualization and pm4py, the application also leverages two other libraries, [d3](https://d3js.org/) and [BPMN layout generators](https://github.com/process-analytics/bpmn-layout-generators).
* **d3** is used to manipulate colors and add a legend to the visualized BPMN diagrams.
* **BPMN layout generators** is used to generate the layout of the discovered BPMN process models produced by pm4py. ⚠️ Please note that BPMN layout generators is still in an **experimental version** and may not produce optimal or visually appealing layouts.
## Prerequisites
You can skip this part if your system meets all the requirements listed below 👇
* [Backend requirements](./backend/README.md)
* [Backend Mock Server requirements](./backend-mock-server/README.md) (only needed if you want to simulate the Backend during Frontend developments)
* [Frontend requirements](./frontend/README.md)## Setup
* Clone the project in your preferred IDE (e.g. VScode)
* Prepare the backend environment:
1. Navigate to the `backend` folder: `cd backend`
2. Create a virtual environment for dependencies called `venv` using the following command:
```sh
python -m venv venv
```
3. Activate the created `venv` by running:
* **Windows**:
```sh
venv\Scripts\activate.bat
```
* **Unix/MacOS**:
```sh
venv/bin/activate
```
4. Install the required libraries listed in `requirements.txt` by running:
```sh
pip install -r requirements.txt
```
* Prepare the frontend environment:
1. Navigate to the `frontend` folder: `cd ../frontend`
2. Install the required libraries listed in `package.json` by running:
```sh
npm install
```
## Run
1. Navigate to the `backend` folder: `cd backend`
2. Run the application:
```sh
python app.py
```
3. Open a new terminal and navigate to the `frontend`folder: `cd frontend`
4. Run the development web server:
```sh
npm run dev
```
5. Access the web application on the displayed localhost: http://localhost:5173/## License
This project is licensed under the GPL-3.0 license because the backend part of the code uses the pm4py library, which is licensed under this license.
The front end part of the code uses the bpmn-visualization library, which is licensed under the Apache-2.0 license. The legends in the project are generated using d3, which is licensed under the ISC license.
Please note that the different licenses may have different requirements, so make sure to review the license terms carefully before using or contributing to this project.
## Release how-to
When all updates have been completed, you are ready to publish a new release.
Create a new GitHub release by following the [GitHub help](https://help.github.com/en/github/administering-a-repository/managing-releases-in-a-repository#creating-a-release)
- for `Tag version`, use a value following the **vX.Y.Z** scheme using the [Semantic Versioning](https://semver.org/).
- for `Target`
- usually, keep the `main` branch except if new commits that you don't want to integrate for the release are already
available in the branch
- in that case, choose a dedicated commit
- Description
- briefly explain the contents of the new version
- make GitHub generates the [release notes automatically](https://docs.github.com/en/repositories/releasing-projects-on-github/automatically-generated-release-notes)