Creatig objects with constructors

GoJS
1

Hi, I have a small problem I whant to create a simple diagramusing gojs, but instead of using GraphObject.make(type, initializers) static call I want to use object constructors.

So my code look like

var shape = new go.Shape ();
shape.fill = “White”;
shape.figure = “Triangle”;
var node = new go.Node ();
node.shape = shape;

but node do not have shape property and I’m unable to find out which property of Node should be setted as shape.

The reason I’m not using GraphObject.make(type, initializers) is that I’m not codding directly in javascript, but writing a wrapper with Java using GWT.

2

A Node can have many Shapes, so having a Node.shape property would not make sense.

Instead you want to call Panel.add(obj). Node inherits from Panel.
Note also that you probably want to set the Panel.type property.

Is there a utility for importing a WebIDL file into GWT?
I am wondering about the easiest way to support GWT.

3

Upon further consideration, why don’t you define all of your templates and most of the Diagram initialization in JavaScript as part of a single JSNI function implementation?

That might even include a lot of the event handlers, if they do not require interaction with the rest of your GWT app.

You would just need a method to pass a couple of JavaScript arrays to initialize the Diagram.model.nodeDataArray and .linkDataArray. If your diagram usage requires saving changes that the user has made, you would also need to pass the modified arrays back to GWT.

4

I need a full support of API classes. So I’m writing a wraper JAVA class for every JS Obejct that is available with GoJS API. So I have already overcome this problem but I have a other one.

The GoJS has a method that checks if the object is array or not.

    isArray: function (a) {
        return a instanceof Array || a instanceof NodeList || a instanceof HTMLCollection
    },
    mB: function (a, b, c) {
        u.isArray(a) || u.zc(a, "Array or NodeList or HTMLCollection", b, c)
    },

But this is not working in frame based application (like any GWT application), as Array object returned by inner frame will not pass the “instanceof Array” statement.
For more info see instanceof considered harmful or how to write a robust isArray — Perfection Kills
Do you have any idea how can I use GoJS in frame based application where the data is coming from the inner frame, but the main logic is in the main frame ?

5

Full example code

var $ = go.GraphObject.make;  // for conciseness in defining templates

myDiagram = new go.Diagram("myDiagram");  // create a Diagram for the DIV HTML element

// define a simple Node template (but use the default Link template)

var shape = new go.Shape();
var colorBinding = new go.Binding ("fill", "color");
shape.figure = "RoundedRectangle";
shape.bind (colorBinding);

var textBlock = new go.TextBlock ();
var valueBinding = new go.Binding ("text", "key");
textBlock.margin = 3;
textBlock.bind(valueBinding);

var node = new go.Node (); 
node.type = go.Panel.Auto;
node.add (shape);
node.add (textBlock);
myDiagram.nodeTemplate = node;

// create the model data that will be represented by Nodes and Links

var iframe = document.createElement(‘iframe’);
document.body.appendChild(iframe);
xArray = window.frames[window.frames.length-1].Array;
var nodeDataArray = new xArray();
nodeDataArray.push({ key: “Alpha”, color: “LightBlue” });
nodeDataArray.push({ key: “Beta”, color: “Orange” });
nodeDataArray.push({ key: “Gamma”, color: “LightGreen” });
nodeDataArray.push({ key: “Delta”, color: “Pink” });

var linkDataArray = [
{ from: “Alpha”, to: “Beta” },
{ from: “Alpha”, to: “Gamma” },
{ from: “Beta”, to: “Beta” },
{ from: “Gamma”, to: “Delta” },
{ from: “Delta”, to: “Alpha” }
];

var model = new go.GraphLinksModel();
model.nodeDataArray = nodeDataArray;
model.linkDataArray = linkDataArray;
myDiagram.model = model;

The nodeDataArray is Array but it does not pass the instance of

6

The next release (1.0.7) will handle Arrays and Objects created in other frames.