无法使用gojs渲染交互式图像

Question

我想用goJs创建一个交互式图像，但是当我尝试按照教程创建一个基本的视觉效果时，我得到的输出只是一个空白框，而不是由一行连接的“Alpha”和“Beta”这两个单词的交互式图像。

这是我的代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://unpkg.com/gojs/release/go-debug.js"></script>
    <script src="go.js"></script>
    <script>
        function init() {
            var $ = gp.GraphObject.make;
            myDiagram = $(go.Diagram, "decisionTree");
            var nodeDataArray = [
                { key: "Alpha" },
                { key: "Beta" }
            ];
            var linkDataArray = [
                { to: "Beta", from: "Alpha" }
            ];
            myDiagram.model = new go.GraphLinksModel(nodeDataArray, linkDataArray)
        }
    </script>
</head>
<body onload="init"()>
    <div id="decisionTree" style="width:300px; height:300px; border:1px solid black;"></div>
</body>
</html>

教程：https://www.youtube.com/watch?v=7cfHF7yAoJE#action=share

Answer 1

您正在加载两个不同版本的GoJS库。我建议你删除这一行：

<script src="go.js"></script>

编辑:此外，在阅读您的代码时，我还遗漏了一些拼写错误。这实际上是有效的：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://unpkg.com/gojs/release/go-debug.js"></script>
    <script>
        function init() {
            var $ = go.GraphObject.make;
            var myDiagram = $(go.Diagram, "decisionTree");
            var nodeDataArray = [
                { key: "Alpha" },
                { key: "Beta" }
            ];
            var linkDataArray = [
                { to: "Beta", from: "Alpha" }
            ];
            myDiagram.model = new go.GraphLinksModel(nodeDataArray, linkDataArray)
        }
    </script>
</head>
<body onload="init()">
    <div id="decisionTree" style="width:300px; height:300px; border:1px solid black;"></div>
</body>
</html>