ズーム時にマウスホイールのパンを無効にしますが、ドラッグ時にマウスホイールを無効にします。

Question

d3でズーム機能を使用しようとしています。それはそれは、多かれ少なかれ、正常に動作していますので、それはマウスホイールとドラッグのフライパンにズームインし、次のコード

var zoom = d3.behavior.zoom() 
        .scaleExtent([0.5, 4]) 
        .on("zoom", function() { 
         this.svg.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")"); 
        }.bind(this)); 

で、シンプルなものです。それが欲しいです。しかし、マウスホイールでズームすると、パンも動きます。それは、私は欲しくない。 マウスホイールとパンをドラッグしたときにズームする必要があります。別のドラッグ機能やマウスホイールの一部（私は惨めに失敗しました）を無効にするなど、いくつかのことをすでに試しましたが、役に立たない。

私を助けてください。

Answer 1

デフォルトでは、コードはマウスの位置に合わせてズームされます。

あなたが画面の中央にズームしたい場合は、そのように明示的にズーム動作にcenter()を設定する必要がありますいずれかの段階でデフォルトのズーム中心の動作をリセットする必要がある場合

var zoom = d3.behavior.zoom() 
    .scaleExtent([0.5, 4]) 
    .center([width/2, height/2]) 
    .on("zoom", function() { 
    this.svg.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")"); 
    }.bind(this)); 

それはMOUにマウスホイールでズームしますが、デフォルトではZoom Center