Question

我创建了一个小片段来简化我的问题： http://www.chartjs.org/docs/latest/axes/cartesian/#tick-configuration

var svg = d3.select("#chart")
  .append("svg")
  .attr("width", "100%")
  .attr("height", "100%")
  .call(d3.zoom().on("zoom", function () {
    if (d3.event.sourceEvent.ctrlKey) {
      svg.attr("transform", d3.event.transform);
    }
}))
.append("g");

svg.append("circle")
  .attr("cx", document.body.clientWidth / 2)
  .attr("cy", document.body.clientHeight / 2)
  .attr("r", 50)
  .style("fill", "#B8DEE6")

我在滚动容器中有一个可缩放的d3图表。我想用鼠标滚轮滚动而不是缩放。缩放应该在ctrl + wheel上进行。

我如何配置图表，因此我不必手动滚动浏览＆jQuery.scroll（）＆＃39;？有一个简单的方法吗？

亲切的问候

Answer 1

您可以使用filter方法：

var zoom = d3.zoom()
  .on("zoom", function () {
    svg.attr("transform", d3.event.transform);       
  })
  .filter(function(){
    return d3.event.ctrlKey;
  });

在滚动容器中垂直滚动d3图表

1 个答案: