文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在带角模板的Javascript中使用D3-GraphViz

问如何在带角模板的Javascript中使用D3-GraphViz
EN

Stack Overflow用户

提问于 2022-07-06 02:07:19

回答 1查看 131关注 0票数 1

我试图在一个角度模板(如d3-graphviz )中使用这里描述的这里。d3-graphviz站点上的演示指示我将以下代码放在index.html文件中

 <!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="//d3js.org/d3.v5.min.js"></script>
<script src="https://unpkg.com/@hpcc-js/wasm@0.3.11/dist/index.min.js"></script>
<script src="https://unpkg.com/d3-graphviz@3.0.5/build/d3-graphviz.js"></script>
<div id="graph" style="text-align: center;"></div>
<script>

d3.select("#graph").graphviz()
    .renderDot('digraph  {a -> b}');

</script>

但是，当我将它放入dashboard.component.html文件(这是我希望显示结果的地方)时，我在控制台中得到以下错误

ERROR TypeError: pe.select is not a function
at h.ngOnInit (383.js:1:105583)
at Ki (main.js:1:183802)
at qn (main.js:1:183633)
at ao (main.js:1:183353)
at Ha (main.js:1:210163)
at Gv (main.js:1:210461)
at Ha (main.js:1:210486)
at $v (main.js:1:217064)
at wv (main.js:1:210896)
at Ha (main.js:1:210907)

如果能提供任何帮助，我们将不胜感激。如果需要，我可以提供更多的信息。

javascript

html

angular

d3.js

graphviz

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-07-11 11:17:14

这是因为当您运行脚本时，d3还没有加载。

将d3脚本放在head标记中，然后按如下方式运行该脚本：

document.addEventListener("DOMContentLoaded", function(event) { 
  d3.select("#graph").graphviz()
    .renderDot('digraph  {a -> b}');
});

这样，脚本将在加载所有脚本链接后执行。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/72877217

复制

相似问题

问如何在带角模板的Javascript中使用D3-GraphViz
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在带角模板的Javascript中使用D3-GraphVizEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在带角模板的Javascript中使用D3-GraphViz
EN