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