javascript - How to chain a function call in D3? -


defined draw function in order reuse, it's standalone statement.

draw(circles); 

is there way put (rewrite) draw function d3's function chain?

svg.selectall("circle")             .data(dataset)             .enter()             .append("circle")             .draw(???) //not work.  

here code. working version here

<body>     <script type="text/javascript">          var draw = function (circles) {             circles.attr("cx", function (d, i) {                 return (i * 50) + 25;             })          .attr("cy", h / 2)          .attr("r", function (d) {             return d;          });         };          var w = 500, h = 50;          var dataset = [5, 10, 15, 20, 25];         var dataset2 = [25, 20, 15, 10, 5];          var svg = d3.select("body")                     .append("svg")                     .attr("width", w)                     .attr("height", h);          var circles = svg.selectall("circle")             .data(dataset)             .enter()             .append("circle")          draw(circles);          var circles2 = svg.selectall("circle")         .data(dataset2)         .transition()         .duration(2000);          draw(circles2);      </script> </body> 

use call() + in draw(). working version here

var draw = function () {     this.attr("cx", function (d, i) {         return (i * 50) + 25;     })     .attr("cy", h / 2)     .attr("r", function (d) {         return d;     }); };  circles .data(dataset) .enter() .append("circle") .call(draw) .data(dataset2) .transition() .attr("fill", "red") .duration(2000) .call(draw); 

Comments

Popular posts from this blog

Java 8 + Maven Javadoc plugin: Error fetching URL -

css - SVG using textPath a symbol not rendering in Firefox -

c - gcc compile error: unknown type name 'File' -