Question

我已经分别使用d3.js创建了条形图和饼图。现在我想使用jQuery将条形图和饼图调用到另一个html中。

$(document).ready(function() {
    console.log("ready!");
    $("#piediv").load("file:///usr/local/d3/samplepi.html"); 
    $("#bardiv").load("file:///usr/local/d3/bar.html"); 
});

<body> 
    <div id="piediv"></div>
    <div id="bardiv"></div>
</body>

但我面临一个错误，即

NS_ERROR_DOM_BAD_URI：访问受限制的URI被拒绝
  ...它（V）中，b = ZT（V），_ =它（d）中，w = ZT（d），S = IT（M）中，k = ZT（M），E =它（Y）， A = ZT（Y）; p.forEach（功能...
  d3.v3.min.js（第1行）

我怎样摆脱这个问题。有人可以就这个问题提出建议吗？

提前致谢

Answer 1

您无法加载文件系统路径文件，而应使用相对/绝对路径。

如此：

$("#piediv").load("file:///usr/local/d3/samplepi.html");

应该像这样尝试：

$("#piediv").load("/usr/local/d3/samplepi.html");

"/usr/local/d3/samplepi.html"这将是您跟随的文件夹结构的相对路径。

注意：

要查看.load()是否有效，您应该设置一个网络服务器，因为它在内部使用ajax加载。

Answer 2

使用2个iframe？每个html 1个。根据需要使用css设置iframe的样式。

<body>
    <iframe src="graph1.html"></iframe>
    <iframe src="graph2.html"></iframe>
</body>

如何使用jQuery将两个htmls包含到另一个html中

2 个答案:

注意：