# Graph view libraries in ignition?

**URL:** <https://forum.inductiveautomation.com/t/graph-view-libraries-in-ignition/97342>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [October 16, 2024, 8:11pm UTC](https://forum.inductiveautomation.com/t/graph-view-libraries-in-ignition/97342 "2024-10-16T20:11:16Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![msteele](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/msteele/32/77889_2.png) [@msteele](https://forum.inductiveautomation.com/u/msteele)\
**Post date:** [October 16, 2024, 8:11pm UTC](https://forum.inductiveautomation.com/t/graph-view-libraries-in-ignition/97342/1 "2024-10-16T20:11:17Z")

</div>

I'm looking to use an [Obsidian-like graph view](https://www.youtube.com/watch?v=Z8WIALfgaA4) in Perspective. Has anyone done this? I haven't seen any charting modules that handle this type of thing.

We have a cache of entity relationships which we already heavily use to build Perspective sessions at runtime. The primary relationship is parent/child as determined by tag path, but we also have other relationships which could be overlaid - e.g. what asset controls what other asset, what asset pushes or pulls power to what other asset, and what assets are networked together? We already have these relationships, and a graph view would be an amazing way to visualize them.

Edit: Added screenshot to hook your curiosity.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/6/d64528359f7a89105a4e2d02cb5db03ba5c5d987.png)

---

<div class="post-metadata">

**Author:** ![msteele](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/msteele/32/77889_2.png) [@msteele](https://forum.inductiveautomation.com/u/msteele)\
**Post date:** [October 16, 2024, 9:03pm UTC](https://forum.inductiveautomation.com/t/graph-view-libraries-in-ignition/97342/2 "2024-10-16T21:03:51Z")

</div>

It looks like the graph type in a charts.js expansion pack is what would do it: [GitHub - sgratzl/chartjs-chart-graph: Chart.js Graph-like Charts (tree, force directed) · GitHub](https://github.com/sgratzl/chartjs-chart-graph)

And it looks like @bmusson's module includes it:

> [@Musson Industrial’s Embr-Charts Module](https://forum.inductiveautomation.com/t/musson-industrial-s-embr-charts-module/91618/1):
>
> Embr-Charts Musson Industrial is excited to announce the release of embr-charts, an Ignition module that adds a collection of enhanced Perspective charting components. Chart.js Component This initial release contains a [Chart.js](https://www.chartjs.org/) component. [https://github.com/mussonindustrial/embr/raw/main/modules/embr-charts/docs/examples/chart-js.png](https://github.com/mussonindustrial/embr/raw/main/modules/embr-charts/docs/examples/chart-js.png) Chart.js renders chart elements on an HTML5 canvas unlike other D3.js-based charting libraries that render as SVG. Canvas rendering makes Chart.js very performa…

---

<div class="post-metadata">

**Author:** ![bmusson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmusson/32/87530_2.png) [@bmusson](https://forum.inductiveautomation.com/u/bmusson)\
**Post date:** [October 16, 2024, 10:35pm UTC](https://forum.inductiveautomation.com/t/graph-view-libraries-in-ignition/97342/3 "2024-10-16T22:35:29Z")

</div>

Yup, it does!

I haven’t used it for anything real, but I did test it enough to prove that the plugin worked (got an example graph to render).

I’d love any feedback you have.

---

<div class="post-metadata">

**Author:** ![Stef\_Van\_Poucke](https://avatars.discourse-cdn.com/v4/letter/s/dec6dc/32.png) [@Stef\_Van\_Poucke](https://forum.inductiveautomation.com/u/Stef_Van_Poucke)\
**Post date:** [October 17, 2024, 5:00am UTC](https://forum.inductiveautomation.com/t/graph-view-libraries-in-ignition/97342/4 "2024-10-17T05:00:23Z")

</div>

This looks very interesting.  
This kind of chart could be very usefull to visualise and diagnose network issue's

---

<div class="post-metadata">

**Author:** ![bmusson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmusson/32/87530_2.png) [@bmusson](https://forum.inductiveautomation.com/u/bmusson)\
**Post date:** [October 20, 2024, 10:15pm UTC](https://forum.inductiveautomation.com/t/graph-view-libraries-in-ignition/97342/5 "2024-10-20T22:15:14Z")

</div>

Currently [waiting for a fix on an issue in graph chart add-on](https://forum.inductiveautomation.com/t/musson-industrial-s-embr-charts-module/91618/55), but this should get your wheels rolling.

Snapshot module release and project export included below.

The project export contains an embedded version of our [pyro-mui-joy](https://github.com/mussonindustrial/pyro/tree/main/packages/pyro-mui-joy) theme, so you don't need to install it yourself (I've been using the theme so much that I don't know how to do anything without it lol).

Also requires @pturmel’s Integration Toolkit (you should have it installed anyways).

This project also shows off some advanced features of the `Chart.js` component, including:

1. Scriptable properties (used for the node types).
2. Events (used for the node selection)

[embr-charts-demo\_20241020220929.zip](https://forum.inductiveautomation.com/uploads/short-url/7JXce5AeQMllcUxJJhFiO5ujp2.zip) (135.5 KB)

[Embr-Charts-SNAPSHOT.modl](https://forum.inductiveautomation.com/uploads/short-url/xV5EQBrqsK49mTZfuDMg5nEWxsD.modl) (1.9 MB)
