py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
humble

Package Summary

Tags	No category tags.
Version	0.6.5
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	release/0.6.x
Last Updated	2025-01-13
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
jazzy

API Docs
Browse Code

Package Summary

Tags	No category tags.
Version	0.6.6
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	devel
Last Updated	2025-01-14
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.6 (2025-01-13)

[infra] Add dummy test to make buildfarm happy
[infra] Fix repo URL in package.xml
Contributors: Sebastian Castro

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
kilted

API Docs
Browse Code

Package Summary

Tags	No category tags.
Version	0.6.6
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	devel
Last Updated	2025-01-14
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.6 (2025-01-13)

[infra] Add dummy test to make buildfarm happy
[infra] Fix repo URL in package.xml
Contributors: Sebastian Castro

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
rolling

API Docs
Browse Code

Package Summary

Tags	No category tags.
Version	0.6.6
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	devel
Last Updated	2025-01-14
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.6 (2025-01-13)

[infra] Add dummy test to make buildfarm happy
[infra] Fix repo URL in package.xml
Contributors: Sebastian Castro

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code

No version for distro github showing humble. Known supported distros are highlighted in the buttons above.

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
humble

API Docs
Browse Code

Package Summary

Tags	No category tags.
Version	0.6.5
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	release/0.6.x
Last Updated	2025-01-13
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code

No version for distro galactic showing humble. Known supported distros are highlighted in the buttons above.

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
humble

API Docs
Browse Code

Package Summary

Tags	No category tags.
Version	0.6.5
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	release/0.6.x
Last Updated	2025-01-13
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
iron

API Docs
Browse Code

Package Summary

Tags	No category tags.
Version	0.6.6
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	devel
Last Updated	2025-01-14
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.6 (2025-01-13)

[infra] Add dummy test to make buildfarm happy
[infra] Fix repo URL in package.xml
Contributors: Sebastian Castro

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

No known dependants.

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code

No version for distro melodic showing humble. Known supported distros are highlighted in the buttons above.

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
humble

API Docs
Browse Code
Wiki

Package Summary

Tags	No category tags.
Version	0.6.5
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	release/0.6.x
Last Updated	2025-01-13
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code Wiki

No version for distro noetic showing humble. Known supported distros are highlighted in the buttons above.

py_trees_js package from py_trees_js repo

py_trees_js

ROS Distro
humble

API Docs
Browse Code
Wiki

Package Summary

Tags	No category tags.
Version	0.6.5
License	BSD
Build type	AMENT_PYTHON
Use	RECOMMENDED

Repository Summary

Description	Javascript library for behaviour tree visualisation, demo'd with a qt-js hybrid application
Checkout URI	https://github.com/splintered-reality/py_trees_js.git
VCS Type	git
VCS Version	release/0.6.x
Last Updated	2025-01-13
Dev Status	MAINTAINED
Released	RELEASED
Tags	pyqt5 jointjs behaviour-trees qt-js-application
Contributing	Help Wanted (-) Good First Issues (-) Pull Requests to Review (-)

Package Description

Javascript library for visualising behaviour trees.

Additional Links

Maintainers

Daniel Stonier

Authors

Daniel Stonier

README.md

PyTrees Js

[About] [Features] [Preview] [Exmaple - Simple Web App] [Example - PyQt App] [The JSON Specification]

About

Libraries for visualisation of runtime or replayed behaviour trees.

./js - a self-contained javascript library to build apps around
py_trees_js - a python package that makes the js available as a pyqt resource
py_trees_js.viewer - a demo pyqtwebengine app

See py_trees_ros_viewer for a fully fledged pyqt integration that uses py_trees_js.

Features

Visualise the runtime state of a behaviour tree
Collapsible subtrees
Zoom and scale contents to fit
Timeline rewind & resume
Blackboard key-value storage view
Activity log view

Although designed for py_trees, the js libs (in particular, the interfaces) are not dependent on py_trees and could be used for other behaviour tree applications.

Preview

With VSCode DevContainers and on a PC with an NVIDIA GPU:

Install VSCode
Install the NVIDIA Container Toolkit
Clone and launch the demo:

$ git clone https://github.com/splintered-reality/py_trees_js
$ code .
$ cd py_trees_js

# Reopen the project in the devcontainer
$ (use CTRL-SHIFT-P if you miss VSCode's helper dialog)

# Setup and launch
$ poetry install
$ poetry run py-trees-demo-viewer

If you do not have a PC that meets those requirements, some alternative options:

Install Poetry and PyQt on your system or in a venv. Clone and launch.
If you’re just interested in seeing the demo viewer, pip install --user py_trees_js and launch the viewer
Create your own devcontainer with something like the desktop-lite feature. If this works, send me a PR!

Example - Simple Web App

Building a complete application that can render a behaviour tree stream is an effort that can be decomposed into two tasks:

Creating the web app for rendering trees and visualising a timeline
Wrapping the web app in a framework and connecting it to an external stream

The first stage is purely an exercise with html, css and javascript. The latter will depend on your use case - it could be a qt-js hybrid application (as exemplified here) for developers, an electron application for cross-platform and mobile deployment or a cloud based service.

This section will walk through how to build a web application with the provided js libraries. An example of wrapping the web app within a Qt-Js application will follow.

To get started, let’s begin with a basic html page with two divs, one for the tree canvas and one for the timeline:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>PyTrees Viewer</title>
  <style>
    html {
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
    body {
      margin: 0;
      overflow:hidden;  /* no scrollbars */
      height: 100%  /* canvas is intended to fill the screen, cascading heights achieves this */
    }
  </style>
</head>
<body>
  <div id="canvas"></div>
  <div id="timeline"></div>
</body>
</html>

Next, bring in the javascript libraries. For exemplar purposes, it is assumed here that the libraries have been made available alongside the html page - how is an integration detail depending on the mode of deployment (see next section for an example).

Note that the py_trees-<version>.js library has only one dependency, jointjs, but that in turn has a few dependencies of it’s own. The bundled libraries in the js/jointjs folder of this repository correspond to the requirements for a specific version of jointjs and

File truncated at 100 lines see the full file

CHANGELOG

Changelog

0.6.5 (2025-01-11)

[formatter] reformat auto-generated resources.py
[linter] 2 lines between methods
[readme] fix preview instructions, elucidate non-nvidia alternatives
[vscode] devcontainer DISPLAY fix
Contributors: Daniel Stonier

0.6.4 (2022-02-24)

[actions] pre-merge and update-cache, #146
[actions] push containers, #144
[poetry] update project to use poetry, #143
[vscode] devcontainer workflows, #143
[tests] basic tests, formatting, linting, #143

0.6.3 (2020-05-05)

[js] remove buggy early view update and optimise them, #142

0.6.2 (2020-03-02)

[js] bugfix accidentally ignored tree_cache size, #123
... missed a few pull requests inbetween

0.6.0 (2019-12-27)

[js] accepting trees flagged with no status/graph change, #122
[js] blackboard views, #125, #133, #122, #135, #136

0.5.1 (2019-10-26)

[js] performance improvements, #120
[js] highlighted links, #115
[js] orthogonal link connections, for better visualisation
[qt] capture screenshots, #114

0.5.0 (2019-08-29)

[html] disable scrollbars, #110
[js] robustness against identical timestamps, #109
[js] improved window resize handling, #111
- new public api py_trees.canvas.on_window_resize and py_trees.timeline.on_window_resize

0.4.0 (2019-08-13)

Milestone - Polish & Release

0.3.1 (2019-08-07)

Milestone - Interactive Event Timeline

0.2.0 (2019-08-01)

Milestone - Streaming Trees / Qt

0.1.0 (2019-07-25)

Milestone - Render a Tree

Package Dependencies

No dependencies on ROS packages.

System Dependencies

Name
python3-setuptools
pyqt5-dev-tools
qttools5-dev-tools
python3-qt5-bindings
python3-pyqt5.qtwebengine

Dependant Packages

Name	Deps
py_trees_ros_viewer

Launch files

No launch files found

Messages

No message files found.

Services

No service files found

Plugins

No plugins found.

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

API Docs Browse Code Wiki

py_trees_js package from py_trees_js repo

ROS Distrohumble

Package Summary

Repository Summary

Package Description

Additional Links

Maintainers

Authors

PyTrees Js

About

Features

Preview

Example - Simple Web App

Changelog

0.6.5 (2025-01-11)

0.6.4 (2022-02-24)

0.6.3 (2020-05-05)

0.6.2 (2020-03-02)

0.6.0 (2019-12-27)

0.5.1 (2019-10-26)

0.5.0 (2019-08-29)

0.4.0 (2019-08-13)

0.3.1 (2019-08-07)

0.2.0 (2019-08-01)

0.1.0 (2019-07-25)

Package Dependencies

System Dependencies

Dependant Packages

Launch files

Messages

Services

Plugins

Recent questions tagged py_trees_js at Robotics Stack Exchange

py_trees_js package from py_trees_js repo

ROS Distrojazzy

Package Summary

Repository Summary

Package Description

Additional Links

Maintainers

Authors

PyTrees Js

About

Features

Preview

Example - Simple Web App

Changelog

0.6.6 (2025-01-13)

0.6.5 (2025-01-11)

0.6.4 (2022-02-24)

0.6.3 (2020-05-05)

0.6.2 (2020-03-02)

0.6.0 (2019-12-27)

0.5.1 (2019-10-26)

0.5.0 (2019-08-29)

0.4.0 (2019-08-13)

0.3.1 (2019-08-07)

0.2.0 (2019-08-01)

0.1.0 (2019-07-25)

Package Dependencies

System Dependencies

Dependant Packages

Launch files

Messages

Services

Plugins

Recent questions tagged py_trees_js at Robotics Stack Exchange

py_trees_js package from py_trees_js repo

ROS Distrokilted

Package Summary

Repository Summary

Package Description

Additional Links

Maintainers

Authors

PyTrees Js

About

Features

Preview

Example - Simple Web App

ROS Distro
humble

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

ROS Distro
jazzy

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

ROS Distro
kilted

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

ROS Distro
rolling

Recent questions tagged `py_trees_js` at Robotics Stack Exchange

ROS Distro
humble