D3 колесико мыши направление масштабирования

Question

Я пытаюсь создать некоторые пользовательские функции масштабирования в d3.js. В настоящее время масштабирование запускается одним щелчком мыши и масштабируется, чтобы сфокусироваться только на области, на которую было нажата кнопка.

В настоящее время мой код имеет function zoom(d), который выполняет именно то, что ему нужно. Существует также var zoomTransition, который находится внутри zoom() и отвечает за большую часть функциональности. К сожалению, я не могу поделиться большей частью своего кода.

Масштаб также должен появляться на прокрутке мыши. Трудность, которую я испытываю, заключается в следующем:

 .on("wheel", function(d){ 
      zoom(d); 
     }); 

не учитывает направление колесика прокрутки. Масштаб называется просто потому, что колесо прокручивается, как в, так и влево.

Есть ли способ получить доступ к направлению прокрутки и передать его в zoom()? Или лучший способ сделать это?

Answer 1

Искал это:

.on("wheel", function(d){ 
      var direction = d3.event.wheelDelta < 0 ? 'down' : 'up'; 
      zoom(direction === 'up' ? d : d.parent); 
     }); 

Более того Javascript, чем d3, но это, как вы получаете доступ к данные колеса прокрутки.

Answer 2

d3 имеет поведение масштабирования, которое может показаться вам полезным.

Пример кода:

var zoom = d3.behavior.zoom() 
     .scaleExtent([0, 10]) 
     .on("zoom", redraw); //if you are sure that your zoom function is working just replace redraw with your zoom function 


function redraw() { 
    return svg.attr("transform", "translate(" + d3.event.translate + ")" + " scale(" + d3.event.scale + ")"); 
} 

Полный пример:

http://bl.ocks.org/mbostock/2206340