I'm having to need to track the current progress of my product when they move through the production process.
The idea was to have some sort of horizontal GIT branch visual, where the dots would have a checkmark when done, and else empty. A bit like this image:
Would any of you have done something like this before? If not, does any of you have any tips on getting started on building my own component?
For example, a question I have for building modules is, how can you test your code really quickly without having it to import allot in your gateway?
This would be possible without making a module. You could create a script that parses some input to make a graph like this into the svg component.
That will require some "logical coding" ect.
Or if you want a module you can easily import one of the many librabrys from npm like react-flow or gitgraph which do things like that.(many many more libraries). Then you'll have to do some "techinal coding" to make everything work in ignition.
The easiest is to make a react component first and test that out with all the tools in node.
Then once that works you can import the component into the igntion bit where you link all the props and events.
I believe i read somewhere you could directly build your module into the right folders so you didnt need to import it, but i never tried that
The SVG way seems a bit limited to me, because each dot will probably has to be hovereable/clickeable (I assume that makes it much harder). Would your SVG approach be maintainable?
Idk, both seem viable to me.
Being able to make a perspective module is definitly nice. So for that alone it would be great:p
Importing the drawing logic from one of the libraries would also be really easy.
But if you have no experience with js/module building. And no time to figure it out. Than svg is just as good, and might be easier to edit to your needs than using a library and having to change a module.