D3 obtain the true position of the mouse

V5 version is described here

                                        

//在缩放的事件中将 transform 存储为this
注:(这个变量在缩放和平移的过程中,会更新此变量)
var transform = d3.zoomTransform(ele);
this.transform = transform;

//在获得真实坐标的时候,缩放和偏移的变量进行核算
var translateVar = [0, 0];
if (this.transform) {
    translateVar[0] = this.transform.x;
    translateVar[1] = this.transform.y;
}

var scaleVar = this.transform.k;
if (!scaleVar) {
    scaleVar = 1;
}
var coordinates = d3.mouse(this);
var x = (coordinates[0] - translateVar[0]) / scaleVar;
var y = (coordinates[1] - translateVar[1]) / scaleVar;

此时x,y 为真实坐标

 

Published 50 original articles · won praise 20 · views 20000 +

Guess you like

Origin blog.csdn.net/lhf214111967/article/details/104290554