javascript - Setting the circle radius in d3js with a dynamic variable -
i have set of data in searchbutton function calls different numbers in array so: values[80,20,10] in x variable have scale d3js.
x = d3.scale.linear() .domain([0, d3.max(values)]) .range([0, width]); now have function called grow , within grow set of circles based on values in searchbutton function.
this.grow = grow; function grow(size) { circle.attr("r",size / 5 + 10).transition().duration(2000); } when set grow function size parameter grows transition not working @ on it.
in order d3 transition work, need animate property starting default value desired value. following:
this.grow = grow; function grow(size) { circle .attr('r', 0) .transition() .ease('linear') //.ease('cubic-in-out') // default .duration(2000) .attr('r', size / 5 + 10); } this animate circle 0 radius desired radius. may need adjust logic, maybe don't want default radius (before transition) value of 0.
could make fiddle or post entire code? how calling grow function?
Comments
Post a Comment