Problem with "Get Started...."

GoJS
1

The first five lines of code in “Get Started …”
gives me this error.
But I can run the examples.

Uncaught Error: Invalid DIV id;
could not get element with id: myDiagramDiv

2

You need to make sure an HTML <div> element exists with that id in your page.

You might want to look at the Minimal sample, Minimal GoJS Sample, and invoke the “View Page Source” command to see the text of the whole page.

3

This code gives me the error.

<!DOCTYPE html>
<html>
<head>
    <script src="go-debug.js"></script>
    <script>

        var $ = go.GraphObject.make;
        var myDiagram = 
            $(go.Diagram,"myDiagramDiv");

    </script>
</head>

<body>
    <div id="myDiagramDiv" style="width:400px; height:150px; background-color:#DAE4E4;">
    </div>
</body>
</html>
4 
<!DOCTYPE html>
<html>
<head>
    <script src="go-debug.js"></script>
    <script>

        var $ = go.GraphObject.make;
        var myDiagram = 
            $(go.Diagram,"myDiagramDiv");

    </script>
</head>

<body>
    <div id="myDiagramDiv" style="width:400px; height:150px; background-color:#DAE4E4;">
    </div>
</body>
</html>
5

Why can I not see the code I post???

    var $ = go.GraphObject.make;
    var myDiagram = 
        $(go.Diagram,"myDiagramDiv");

</script>
7

The problem is that the script is running before the DIV is created, because the script is in the <head> and is executed immediately.

If you look at our samples you’ll notice we use an onload handler with an init() function in order to get around this.

See the source of: Minimal GoJS Sample

8

Thanks Simon,
I thought just follow the “Get Started With GoJS” (tutorial ??).

When I posted the code in the Reply box it did not show up.
Is there anything I should know about this ?

9

The code you pasted was a problem because it was HTML and the forum tried to parse it as HTML. Next time if you select it all and press CTRL+K it will appear correctly as formatted code for display.

Running JavaScript only after the page has completed loading is common, which is why jquery’s .ready() are so widely used. It is possible to get it to work without an onload handler if you put your <script> tag below the <body> of the document.

10

and Tanks again Simon,

I’m still trying to get all the css, html, javascript, jquery, bootstrap, express, node, and mongo into one head.
Will take a while.

I just ran into something which could be a bug, but I don’t know if you’r the person to tell about.

When I go with my tablet to gojs.net to samples “Data Visualization” and zoom into the div which has the
hexagons to the point that it covers the whole screen , I can not zoom out anymore.
I wonder if there is a fix for this ?

cheers

11

Unfortunately if you are zoomed entirely into a GoJS canvas it can be hard to get out. Doing a long-tap on the daigram will bring up an HTML context menu and you can pinch-zoom out on that context menu to zoom out on the page again. It’s a little kludgey, but its the easiest built-in way to do it.

12

A post was split to a new topic: Problem getting started