Getting the color in the image at the mouse position

[Elrinth]

Hi!

I'm trying to get the color at the mouse position in the image I'm trying to crop. I'm not really getting the right position here. Am I thinking wrong?

startGettingColor() {
this.$refs.cropper.$el.addEventListener("click", this.getColor);
},
getColor(e) {
var canvas = this.$refs.cropper.getCanvas();
      var pos = {
          x:this.$refs.cropper.$el.offsetLeft,
          y:this.$refs.cropper.$el.offsetTop
        }
      var x = parseInt((e.pageX - pos.x + this.$refs.cropper.imageTransforms.translateX)/this.$refs.cropper.imageTransforms.scaleX);
      var y = parseInt((e.pageY - pos.y + this.$refs.cropper.imageTransforms.translateY)/this.$refs.cropper.imageTransforms.scaleY);
      var p = canvas.getContext('2d').getImageData(x, y, 1, 1).data;
      this.color = p;
      this.$refs.cropper.$el.removeEventListener("click", this.getColor);
};

[Elrinth]

Solved it by creating a crop of the whole image and creating a new image and fetching from that canvas instead...