Question

我使用d3的force.js进行可视化目的。

以下是完整js的片段：

d3.json("test.json", function(json) {
  force.nodes(json.nodes)
      .links(json.links)
      .start();
});

test.json文件当前位于与js文件相同的位置。它工作正常。这些文件位于我的Web应用程序的“pages”文件夹中。如果我使用http url“http：// localhost：8084 / FMS / faces / pages / test.json”代替“test.json”，它可以正常工作。但是，如果我使用“/Users/subashbasnet/test.json”，即文件的路径代替“test.json”，它就不起作用。

如果我将json输出设置为var并使用代替“test.json”它不起作用。例如：

 var myjson = "{"nodes":[{"name":"MYriel","group":1},{"name":"Labarre","group":2}],"links":[{"source":1,"target":0,"value":1}]}";
    d3.json(myjson, function(json) {
      force.nodes(json.nodes)
          .links(json.links)
          .start();
    });

我的.jsp文件有以下输出：

<html>
<head></head>
<body>
<pre>{"nodes":[{"name":"MYriel","group":1},{"name":"Labarre","group":2}],"links":[{"source":1,"target":0,"value":1}]}</pre>
</body>
</html>

我怎么想在<pre>标签内加载json代替“test.json”。

非常期待解决任何一个问题。提前谢谢。

Answer 1

如果您在JSP中生成数据，那么您可以完成它

<script>var theData = (<%= unquotedJsonData %>);</script>

直接生成JS对象而不是JSON字符串

<script>var theData = ({"nodes":[...]});</script>

然后你不需要使用d3的json解析器，只需执行

force.nodes(theData.nodes)....

Answer 2

使用单引号引用您的json字符串

var myjson = '{"nodes":[{"name":"MYriel","group":1},{"name":"Labarre","group":2}],"links":[{"source":1,"target":0,"value":1}]}';

或转义双引号

var myjson = "{\"nodes\":[{\"name\":\"MYriel\",\"group\":1},{\"name\":\"Labarre\",\"group\":2}],\"links\":[{\"source\":1,\"target\":0,\"value\":1}]}";

您的jsp文件只需要输出json字符串

{"nodes":[{"name":"MYriel","group":1},{"name":"Labarre","group":2}],"links":[{"source":1,"target":0,"value":1}]}

将json文件加载到d3.js

2 个答案: