javascript 从 d3.json() 返回数组

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12656580/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 16:47:36  来源:igfitidea点击:

Returning array from d3.json()

javascriptd3.js

提问by Comfort Eagle

As a JQUERY/d3-noob, it seems I cannot figure out how to make this work:

作为一个 JQUERY/d3-noob,我似乎无法弄清楚如何进行这项工作:

  supdog = d3.json(dataPath, function(jsondata){
    return jsondata;
  })
  console.log(supdog);

Thanks in advance.

提前致谢。

回答by Bertjan Broeksema

Besides the fact that your problem description is very terse, the problem seems to be your assumptions about what is returning what.

除了您的问题描述非常简洁这一事实之外,问题似乎在于您对返回什么的假设。

The function d3.json() is an asynchronous function that directly returns (with an undefined value I assume). Only when the data is received from the backend, the callback function you passed to it will be called. Obviously the context is different here and the return value of your callback will not automatically become the return value of d3.json (as this one has returned "long" before already).

函数 d3.json() 是一个直接返回的异步函数(我假设有一个未定义的值)。只有当从后端接收到数据时,你传递给它的回调函数才会被调用。显然这里的上下文是不同的,你的回调的返回值不会自动成为 d3.json 的返回值(因为这个已经返回“long”了)。

What you want to do is probably something like:

你想要做的可能是这样的:

    var jsondata;
    d3.json(dataPath, function(dataFromServer) {
      jsondata = dataFromServer;
    }
    console.log(jsondata);

Update 1:Obviously, the above example is still not fully correct. The call to console.log() is made directly after the d3.json() returned. Thus, the server might not have sent the reply fully yet. Therefore, you can only access data when the callback is returned. Fixed example:

更新1:显然,上面的例子仍然不完全正确。在 d3.json() 返回后直接调用 console.log() 。因此,服务器可能还没有完全发送回复。因此,您只能在回调返回时访问数据。固定示例:

    var jsondata;

    function doSomethingWithData() {
      console.log(jsondata);
    }

    d3.json(dataPath, function(dataFromServer) {
      jsondata = dataFromServer;
      doSomethingWithData();
    })

For a (somewhat stupid, but) working example see: http://jsfiddle.net/GhpBt/10/

对于(有点愚蠢,但是)工作示例,请参阅:http: //jsfiddle.net/GhpBt/10/

Update 2:The above example demonstrates in which order the code is executed but does not really deserve a price for most beautiful code. I myself would not use this "global" variable and simplify the above example to:

更新 2:上面的例子演示了代码的执行顺序,但对于最漂亮的代码来说,它真的不值得付出代价。我自己不会使用这个“全局”变量并将上面的例子简化为:

    function doSomethingWithData(jsondata) {
      console.log(jsondata);
    }

    d3.json(dataPath, doSomethingWithData);

Note how doSomethingWithData is directly passed to d3.json in stead of calling it separately in an anonymous inner function.

注意 doSomethingWithData 是如何直接传递给 d3.json 而不是在匿名内部函数中单独调用的。

Note:This is not a particular problem of d3.js. Basically, all javascript functions that are asynchronous are likely to behave in a similar way. If they return something, it will not be the return value of the passed callback.

注意:这不是 d3.js 的特殊问题。基本上,所有异步的 javascript 函数都可能以类似的方式运行。如果他们返回一些东西,它不会是传递的回调的返回值。

回答by elias

I'm aware that this is a very old post, but I've faced a similar problem recently, and found the following solution, which might worth sharing:

我知道这是一篇很老的帖子,但我最近遇到了类似的问题,并找到了以下解决方案,可能值得分享:

In my case the JSON file's syntax was broken. By default, no errors pop up in the browser in this case, unless you enhance the function suggested by @BertjanBroeksema with errorhandling. Something like this:

在我的例子中,JSON 文件的语法被破坏了。默认情况下,在这种情况下,浏览器中不会弹出任何错误,除非您使用错误处理来增强@BertjanBroeksema 建议的功能。像这样的东西:

function doSomethingWithData(error, jsondata) {
  console.log("error:", error)
  console.log(jsondata);
}

This way you'll see if there was something wrong with the processing of the JSON file.

通过这种方式,您将看到 JSON 文件的处理是否有问题。

回答by Leon

Solutions do not work anymore, if you start with the current d3 version. New solution -> Code within d3.json() callback is not executed

如果您从当前的 d3 版本开始,解决方案将不再起作用。新解决方案 -> d3.json() 回调中的代码未执行

Then it must be...

那么一定是...

d3.json("filename.json")
  .then(function(data){
    console.log(data);
  });