Question

在执行平移或缩放后，我无法在画布上获得正确的鼠标坐标。我有这个代码用于采样坐标和RGB：

// Close the progressdialog
            mProgressDialog.dismiss();

问题是在缩放/平移后坐标是'错误'，例如，左上角不是（0,0）但是（-someX，-someY）......

任何帮助将不胜感激

编辑：我发现了错误，这将解决它。希望它对其他人有用

        canvas1.on('mouse:move', function (e) {
            //allowing pan only if the image is zoomed.
            if (panning && e && e.e) {
                var delta = new fabric.Point(e.e.movementX, e.e.movementY);
                canvas1.relativePan(delta);
            } else {//Read the RGB value of the mouse point
                var mouse = canvas1.getPointer(e.e);

                var x = parseInt(mouse.x);
                var y = parseInt(mouse.y);

                // get the color array for the pixel under the mouse
                var px = ctx.getImageData(x, y, 1, 1).data;

                // report that pixel data
                results.innerHTML = 'At [' + x + ' / ' + y + ']: Red/Green/Blue/Alpha = [' + px[0] + ' / ' + px[1] + ' / ' + px[2] + ' / ' + px[3] + ']';
            }
        });

Answer 1

此代码解决了它，希望它对其他人有用。

 canvas1.on('mouse:move', function (e) {
        //allowing pan only if the image is zoomed.
        if (panning && e && e.e) {
            var delta = new fabric.Point(e.e.movementX, e.e.movementY);
            canvas1.relativePan(delta);
        } else {//Read the RGB value of the mouse point
            var mouse = canvas1.getPointer(e.e);

            var x = e.e.offsetX;//parseInt(mouse.x);
            var y = e.e.offsetY;//parseInt(mouse.y);

            // get the color array for the pixel under the mouse
            var px = ctx.getImageData(x, y, 1, 1).data;

            // report that pixel data
            results.innerHTML = 'At [' + x + ' / ' + y + ']: Red/Green/Blue/Alpha = [' + px[0] + ' / ' + px[1] + ' / ' + px[2] + ' / ' + px[3] + ']';
        }
    });

Fabricjs在缩放或平移后获得RGB像素值

1 个答案: