How to zoom a d3.js DotsChart instead of lineChart -
i want zoom dot chart line each point duplicated zoom step.
g.updatecurve = function(_){     // update line path.     this.select(".line")     .attr("d", line);      // add each point     this.selectall('.circle').data(data).enter().append("circle")     .attr("class", "dot")     .attr("cx", function(d) {return xscale (d.date); })     .attr("cy", function(d) {return yscale (d.yspeed); })     .attr("r", function(d) {return rscale (d.xspeed); });      return this; }; how can change proper zoom ?
i work on jsfiddle
it need costruct dom.circle.data before update fonction:
g.selectall('circle').data(data).enter().append("circle")     .attr("class", "dot"); and juste update .attr() on zoom event
// update attribute of line , dots on zoomevent g.updatecurve = function(){     // update line path.     this.select(".line")     .attr("d", line);      // add each point     this.selectall('circle')     .attr("cx", function(d) {return xscale (d.date); })     .attr("cy", function(d) {return yscale (d.yspeed); })     .attr("r", function(d) {return rscale (d.xspeed); });      return this; }; 
Comments
Post a Comment