我想使用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

最佳答案

您正在加载两个不同版本的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>

10-06 12:35