Running through the steps in a state diagram


We can use the state diagram to draw the nodes and decisions.

Is there a way to load this state diagram and able to step through it based on the results at each step and decision values?


Yes, that is a common thing to do. Examples:
Shop Floor Monitor
Control Instruments: Gauges and Meters

You could show any number of textual properties that update as time goes by.

I can take a look at the sample further. Is the state diagram with decision node done in the same way?

What if i just want to use the diagram to allow the user to setup what flow they need and the checking is done in Java?

You can create custom nodes and links that display whatever information you want that changes whenever you want.

I haven’t tried in years, but my impression is that you can no longer run Java code in all contemporary browsers. At best you might be able to compile Java to JavaScript so that you can execute your code in a browser.

Or did you mean you wanted to run Java on a server and communicate with your diagram in the browser? Of course that is quite common.

Actually i wanted to run the state transitions in the Java server.

The animation is not required, just need to pass a set of data across and get the output.


Yes, it is quite possible. I still have no idea of what kind of app you want to build, so it is hard for me to give any concrete suggestions.

So do you want the app to get state updates at some regular interval and update the diagram?

First, i want to allow the user to define what they want to do. They can draw the diagram to define their flow.

One user can define this:

Another user can define this:

From the Java server, i want to be able to retrieve any of the flow defined when the user selects them. You can see that the result will be different depending on which one is chosen.

I just need to be able to run through the flow and execute through them depending on the results provided from the APIs (externally).

Does this makes more sense now?

Samples that are similar to what I think you are looking for include:
IVR Tree
Fault Tree
And if you actually want an app that has nodes and links exactly like what you show in those screenshots, that’s easy to implement.

A separate issue is how you get the information from the web server. I assume you have defined web APIs to get all of that data whenever you want. Hopefully your database has a simple identifier for each node and for each link, if desired. So when your app asks for updates (or gets it via push notifications) the server can pass a structure that looks like this in JSON:

  { "id": 1234, "prop1": 2.34, "prop2": "some text", "prop3": "some value" },
  { "id": 1235, "prop1": 1.23, "prop2": "more text", "prop3": "some other value" },

Then your code in the client can run through that Array by doing something like:

function processUpdate(msg) {
  const arr = JSON.parse(msg);
  if (Array.isArray(arr)) {
    myDiagram.model.commit(m => {
      arr.forEach(info => {
        const data = m.findNodeDataForKey(;
        if (data) {
          m.set(data, "prop1", data.prop1);
          m.set(data, "prop2", data.prop2);
          m.set(data, "prop3", data.prop3);

That will update those three properties on each Node’s data, and will update the corresponding Node’s GraphObjects that have Bindings on properties depending on those data properties.

Actually after the users uploaded the diagrams, there will not be a need to show on anything on the client.

I just need to run through each of the diagram on the Java backend server to get the result.

Will i need to implement the findNodeDataForKey() at the Java side?

OK, so you have to make sure what you send to the server has all of the information you need to re-create the graph on the server in whatever form it normally deals with such graphs. I have no idea what you have implemented in Java, so I cannot comment on that.

I have no Java code yet, this is why i am trying to ask if there is any Java sample?

Or i need to look at the json data structure to understand how the different nodes are stored?

Sorry, we have nothing in Java.

Yes, the JSON-formatted text should have everything you need.