从局部变量加载D3

Question

嗨我有这个变量myJSON，我想在我的d3力图中使用这是变量的输出。我想知道是否有任何方法可以使用变量来填充我的图表。

var myJSON;

$.ajax({
type: "POST",
url: "http://localhost/web/search.php",
async: false,
data: {
    "dataA": string2
},
cache: false,
success: function(data) {
    myJSON = JSON.parse(data);
},
});

只需将变量放入图形代码中，但它一直给我这个错误uncaught exception: [object ProgressEvent]是否有人知道为什么这不起作用？任何建议将不胜感激。

d3.json("myJSON", function(error, graph) { if (error) throw error;

Answer 1

正如评论中所述。 D3将为您处理AJAX。如果您加载示例并查看chrome中的网络选项卡。您可以看到正在加载miserables.json。

此代码实际上是为您创建一个AJAX GET请求。

d3.json("miserables.json", function(error, graph) {
  if (error) throw error;
  ...

您可以尝试d3.json("http://localhost/web/search.php?dataA=string2", ... 或者可以自己加载它。并用您的JSON替换graph.nodes。

.selectAll("circle")
    .data(graph.nodes)

Answer 2

＆＃39; d3.json＆＃39;函数从文件或URL加载数据。要使用本地json变量，只需进行一些更改。

例如，您有来自d3网站的演示，以及文件中的数据＆＃34; data.json＆＃34;是

{
  "nodes": [
    {"id": "Myriel", "group": 1},
    {"id": "Napoleon", "group": 1},
    {"id": "Mlle.Baptistine", "group": 1}
   ],
    "links": [
      {"source": "Napoleon", "target": "Myriel", "value": 1}
    ]
}

演示就是这样的

d3.json("data.json", function(error, data){
    if(error) throw error;
    console.log(data);

    //some code...
});

这意味着从名为＆＃34; data.json＆＃34;。

的文件中加载数据

现在，如果您已经拥有json变量数据

var data = {
  "nodes": [
    {"id": "Myriel", "group": 1},
    {"id": "Napoleon", "group": 1},
    {"id": "Mlle.Baptistine", "group": 1}
   ],
    "links": [
      {"source": "Napoleon", "target": "Myriel", "value": 1}
    ]
};

只需使用它，将代码更改为：

console.log(data);
//some code...

建议：

您可以从网址加载数据，就像评论所说的那样。使用AJAX从url加载数据，并将其解析为d3代码只能用d3完成。 d3将从网址获取数据。

d3.json("http://localhost/web/search.php", function(error, data){
    if(error) throw error;
    console.log(data);

    //some code...
});