gpt4 book ai didi

javascript - 使用 JSNetworkX 绘制图表

转载 作者:行者123 更新时间:2023-11-29 16:40:17 25 4
gpt4 key购买 nike

我开始探索 JSNetworkX,因为我需要在我的项目中包含一些可视化效果。我从 jsnetworkx.org 上的示例开始,但在我尝试的每个示例中我都遇到了相同的错误:

jsnetworkx.js:5 Uncaught Error: D3 requried for draw().

我包含了D3,所以我不知 Prop 体问题出在哪里。我试图在这个答案中包括旧版本的 D3 TypeError:undefined is not an object (evaluating 'M.layout.force')但它没有帮助,浏览器中没有显示任何内容。

例子如下:

<!DOCTYPE html>
<meta charset="utf-8">
<head>
<script src="jsnetworkx.js"></script>
<script src="https://d3js.org/d3.v4.js"></script>
</head>
<body>

<script>
var G = new jsnx.Graph();

G.addWeightedEdgesFrom([[2,3,10]]);
G.addStar([3,4,5,6], {weight: 5});
G.addStar([2,1,0,-1], {weight: 3});

jsnx.draw(G, {
element: '#canvas',
weighted: true,
edgeStyle: {
'stroke-width': 10
}
});
</script>

</body>
</html>

最佳答案

  1. 更改脚本顺序
  2. 降级到 d3.v3.js
  3. 提供应该渲染的元素
<script src="https://d3js.org/d3.v3.js"     ></script>
<script src="../javascripts/jsnetworkx.js" ></script>

<div id="canvas"></div>

关于javascript - 使用 JSNetworkX 绘制图表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46919451/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com