score:0

There is no need to hack the fisheye library. I think this what you are asking for: http://jsfiddle.net/axelsoto/Yh8cX/. The following function is called on the "mouseup" event:

function moveClosestLines(x, y) {
    var minDistX = Number.MAX_VALUE;
    var minIndexX = 0;
    var minDistY = Number.MAX_VALUE;
    var minIndexY = 0;

    xLine.attr("x1", function (d, i) {
        if (minDistX > Math.abs(x - d)) {
            minDistX = Math.abs(x - d);
            minIndexX = i;
        }
        return xFisheye(d);
    });
    xLine.filter(function (d, i) {
        if (i == minIndexX) {
            return true;
        } else {
            return false;
        }
    })
        .attr("x1", x)
        .attr("x2", x);

    yLine.attr("y1", function (d, i) {
        if (minDistY > Math.abs(y - d)) {
            minDistY = Math.abs(y - d);
            minIndexY = i;
        }
        return yFisheye(d);
    });
    yLine.filter(function (d, i) {
        if (i == minIndexY) {
            return true;
        } else {
            return false;
        }
    })
        .attr("y1", y)
        .attr("y2", y);
}

However, let me say that this is not a good idea as the lines get distorted unproportionally. I think it makes more sense to move the center of the dot to the closest intersection (this is the opposite to what you asked). The logic of the program would the same, although the final update should be on the center of the dot as opposed to on the grid lines.


Related Query

More Query from same tag