https://github.com/123swk123/jointjs-nicegui

JointJS graph UI libray for NiceGUI framework
https://github.com/123swk123/jointjs-nicegui

jointjs nicegui node-graphs nodegraph-framework nodegraph-python

Last synced: 5 months ago
JSON representation

JointJS graph UI libray for NiceGUI framework

• Host: GitHub
• URL: https://github.com/123swk123/jointjs-nicegui
• Owner: 123swk123
• License: mit
• Created: 2024-11-07T10:33:31.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-11-09T19:02:30.000Z (over 1 year ago)
• Last Synced: 2025-07-05T23:36:58.656Z (12 months ago)
• Topics: jointjs, nicegui, node-graphs, nodegraph-framework, nodegraph-python
• Language: Vue
• Homepage:
• Size: 691 KB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

          
# JointJS[+] + Vue 3 + TypeScript + NiceGui + Python

This is an integration framework for [JointJS(Vue-ts)](https://github.com/clientIO/joint) graph UI on to [NiceGUI(python)](https://github.com/zauberzeug/nicegui), thus allowing us to build features and functions

natively on JointJS(+) and auto generate Vue-js files which can be easily integrated with NiceGUI framework.

## Quick Start

### Install all Vue3 project dependencies

`npm install`

### To test in Vue development environment

`npm run dev`

### To test in NiceGui

1. Convert the Vue3 TypeScript files to vue java script

   - for JointJs run `npm run convert-joint`

   - for JointJs+ run `npm run convert-joint+`

2. `cd tests`

3. set environment variable `USE_JOINT_PLUS`

   - for JointJS `USE_JOINT_PLUS=false`

   - for JointJS+ `USE_JOINT_PLUS=true`

4. `python hello.py`

_Note: modify JointJS library path @ `tests/hello.py:JOINT_JS_MODULE_PATH` as per your need_

![JoinJS Hello World on NiceGui](docs/jointjs-demo.gif)