This repository comprises a web application to seamlessly transition between instance- and process-level over multiple abstraction levels of event data in process mining using semantic zooming and contour diagrams.
Figure: GIF demonstrating the application for the running example.
This project is associated with a visual technique proposed at the ICPM 2025 conference in Uruguay, Montevideo. If you would like to use this project in other publications, please cite:
C. Rubensson and J. Mendling, "Time-Order Map for Seamless Zooming between Process Models and Process Instances," 2025 7th International Conference on Process Mining (ICPM), Montevideo, Uruguay, 2025, pp. 1-8, doi: https://www.doi.org/10.1109/ICPM66919.2025.11220736.
Note: This project will be further developed. Therefore, for those interested, the software version associated with the submission of the camera-ready version can consider the release with the name: v3.0-icpm2025-cameraready.
- Download and place the "SEAMLESS_ZOOM" folder somewhere on your computer
- Create a new virtual environment with
python -m venv [namevenv](Recommended) - Activate the new virtual environment with
python -m venv [namevenv](Recommended) - Install the necessary requirements with
pip install -r requirements/requirements_base.txt(alternative:pip install -r requirements/requirements_freeze202505.txt)
Note: Different branches might change the structure of the project. Use the main branch for a clean project.
- Open the terminal on your computer (e.g., "Terminal" on macOS)
- In the terminal: Navigate to the folder "SEAMLESS_ZOOM" via the terminal (
$cd ./SEAMLESS_ZOOM) - Execute the program in the command-line tool with
flask --app webapp run(optional: add--port 8000and/or--debug) - Run the program over the URL
http://127.0.0.1:5000/(adapt port number5000if necessary)
By default, the program utilizes a running example log from https://processmining.org/old-version/event-book.html.
To add your own event log (.xes), simply upload it via the Choose File option and then select Import Event Log. After import, the program will pre-process the log for d3.js (.json).
The program also allows .csv files, although they must be pre-processed manually. The Python function process_log_for_d3js(df)in "src/orchestration" can be used for this purpose.
Some logs recommended are:
- Sepsis cases: https://doi.org/10.4121/uuid:915d2bfb-7e84-49ad-a286-dc35f063a460
- Road traffic fine management process: https://doi.org/10.4121/uuid:270fd440-1057-4fb9-89a9-b699b47990f5
The following parameters adapt the visual encoding of the graph and the transitions.
- Incremental change in opacity for instance elements: Enable the the opacity level of the underlying instance graph to be dynamically adapted with the abstraction level. (Off: Graph always visible; Edges: Only adapt edges; Graph: Adapt entire graph)
- Enable instance element rendering: Enable all visual elements to be dynamically hidden with the abstraction levels. (Note: Enabling this alternative slows down performance.)
- Show/Hide activities: Change the visual encoding to a typical DFG.
Figure: Opacity configuration and instance element rendering.
Figure: Show and hide activities.
The following parameters can be used to redefine the abstraction levels using a contour diagram.
- Bandwidth: Changes the smoothness of the kernel density estimator that produces the contour diagram.
- Thresholds: Changes the number of abstraction levels (Note: The threshold does not equal the number of abstraction levels. This parameter draws approximately uniformly spaced lines based on a 2D Gaussian kernel density estimator.)
- Show/Hide contour lines: Shows or hides the contour diagram.
- Update Graph: Updates the graph with new abstraction levels based on the current contour diagram configurations.
Figure: Using contour diagrams to define abstraction levels.
- Choose File: Choose a file to upload. Only takes .xes- and (pre-processed) .csv files.
- Import Event Log: Import the uploaded file. When done, the graph will be updated.
- Reset to Example Log: Reset the graph to the example log in
"data/example_data". - Export SVG: Downloads the graph with its current styles in .svg format. Also, a .txt document with the current configurations will be downloaded.
(1) Directory problem:
The program was only tested on macOS. On other OS, the program might have trouble finding the folders in the directories of your computer.
Please consider adapting the project_root variable in "webapp/pages.py".
(2) Import problem: Please consider only .xes files or pre-process .csv files (as described above). If a log doesn't work, be sure that it contains at least the following columns:
- Activity:
"concept:name" - Case:
"case:concept:name" - Time:
"time:timestamp"
None of these columns should contain any empty values.
(3) Export problem: If the .txt file is downloaded without a .svg, something is wrong. This is a bug that only happens for some log and will be fixed soon.
(4) Dynamic opacity problems: When using the dynamic opacity transition (Edges/Graph) in combination with Enable instance element rendering, some hidden elements can be stuck. If this happens, turn on Graph and Enable instance element rendering and move the abstraction slider to the highest level. Then, turn off Enable instance element rendering and move back the abstraction slider to the lowest level again. This is a bug that will be fixed soon.
(5) Slow Performance: The application should be able to render any typical benchmark event log in process mining relatively quickly. However, large data sets (approx. > 10,000 cases) can result in slower transitions. Therefore, it is recommended to:
- Filter logs (< 1,000 cases).
- Use Enable instance element rendering only for smaller logs (e.g., 100 cases). Use instead the dynamic opacity parameters (Edges/Graph).
Feel free to contact me for any problems with the program. You find my contact details on https://www.informatik.hu-berlin.de/de/forschung/gebiete/promis/team/christoffer-rubensson.
This project is distributed under the AGPLv3. It makes use of third-party Python and JavaScript packages, whose licenses are provided in the LICENCES_thirdparty/ directory.



