javascript - d3.js(v4) manual zoom and wheel zoom is not matching -
d3 version v4 have button zoom svg element,and aready call d3.zoom; when drag svg,then click button.the svg reverse oraginal position! seem zoom.event.transform independent variable. how can matching zoom , manual transfom?
there code:
var g = svg.select("g"); var zoom = d3.zoom() .scaleextent([1 / 2, 10]); zoom.on("zoom", function () { g.attr("transform", d3.event.transform); }) svg.call(zoom);
there bottonclick code
function zoomextendclick() { var maingroup = svg.select("g"); var transform = d3.zoomtransform(maingroup); if (transform == null) { transform.k = 1; transform.x = 0; transform.y = 0; } transform.k += 0.1; transform.x -= width / 2 * 0.1; transform.y -= height / 2 * 0.1; zoom.scaleto(maingroup, transform.k); };
and transform(x,y)has same problem.
how matching them? there code :https://jsfiddle.net/cloudching/mfb59gb2/10/
Comments
Post a Comment