Javascript 库 d3 调用函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12805309/
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-08-24 08:30:22  来源:igfitidea点击:

Javascript library d3 call function

javascriptd3.js

提问by Andy897

I am not able to understand how d3.call() works and when and where to use that. Hereis the tutorial link that I'm trying to complete.

我无法理解 d3.call() 如何工作以及何时何地使用它。是我正在尝试完成的教程链接。

Can someone please explain specifically what this piece is doing

有人可以具体解释一下这件作品在做什么吗

var xAxis = d3.svg.axis()
              .scale(xScale)
              .orient("bottom");

svg.append("g").call(xAxis);

回答by Superboggly

I think the trick here is to understand that xAxis is a function that generates a bunch of SVG elements. In fact it is the function returned by d3.svg.axis(). The scale and orient functions are just part of the chaining syntax (read more of that here: http://alignedleft.com/tutorials/d3/chaining-methods/).

我认为这里的技巧是理解 xAxis 是一个生成一堆 SVG 元素的函数。实际上它是由 返回的函数d3.svg.axis()。scale 和 orient 函数只是链接语法的一部分(在此处阅读更多内容:http: //alignedleft.com/tutorials/d3/chaining-methods/)。

So svg.append("g")appends an SVG group element to the svg and returns a reference to itself in the form of a selection (same chain syntax at work here). When you use callon a selection you are calling the function named xAxison the elements of the selection g. In this case you are running the axis function, xAxis, on the newly created and appended group, g.

因此,svg.append("g")将一个 SVG 组元素附加到 svg 并以选择的形式返回对自身的引用(此处使用相同的链语法)。当您call在选择上使用时,您正在调用xAxis在选择元素上命名的函数g。在这种情况下,您将xAxis在新创建和附加的组 上运行轴函数g

If that still doesn't make sense, the syntax above is equivalent to:

如果这仍然没有意义,上面的语法等效于:

xAxis(svg.append("g"));

or:

或者:

d3.svg.axis()
      .scale(xScale)
      .orient("bottom")(svg.append("g"));