ScalingOnCustomVector

HTML

<canvas id="canvas" height="500" width="500"></canvas>

JavaScript

var canvas = document.getElementById('canvas'); //destination
var ctx = canvas.getContext("2d");

var canvasSource = document.createElement('canvas'); //source
var ctxSource = canvasSource.getContext("2d");

var canvasLeft = canvas.offsetLeft;
var canvasTop = canvas.offsetTop;
canvas.addEventListener('resize', onWindowResize, false);

var text = "QWER";

var line = {
  	a: {x: canvas.width, y: 50},
  	b: {x: 150, y: canvas.height}
  };

var img = new Image();
img.onload = init;
img.src = "https://static-cdn.123rf.com/images/v5/index-thumbnail/52175178-a.jpg";

function init() 
{
	canvasSource.width = canvas.width;
  canvasSource.height = canvas.height;
  
  ctxSource.font = "normal 64px Calibri";
  ctxSource.textAlign = "center";
  ctxSource.textBaseline = "middle";
  
  ctx.drawImage(img, 0, 0, canvas.width, canvas.height);

  canvas.addEventListener('mousemove', draw, false);
}

function draw(evt) 
{
	function f()
  {
  	drawSourceCanvas(evt.pageX - canvasLeft, evt.pageY - canvasTop);
  	drawScaledScaledCanvas();
  }
  requestAnimationFrame(f);
}

function drawSourceCanvas(x, y) 
{ 
 //draw background
	ctxSource.drawImage(img, 0, 0, canvasSource.width, canvasSource.height);

	//draw text
  ctxSource.save();
  ctxSource.fillStyle = "black";
  ctxSource.translate(x, y);
  ctxSource.fillText( text, 0, 0);
  ctxSource.restore();
}

function drawScaledScaledCanvas() 
{
	ctx.clearRect(0, 0, canvas.width, canvas.height);

	//draw normal part
  ctx.save();
  defineNormalArea();
  ctx.clip();
  ctx.drawImage(canvasSource, 0, 0, canvasSource.width,
  canvasSource.height, 0, 0, canvas.width, canvas.height);
  ctx.restore();
  
  //draw scaled part
  //========================================
  ctx.save();
  defineScaledArea();
  ctx.clip();
  var scale = 0.4;
  var angle = Math.atan2(line.b.y - line.a.y, line.b.x - line.a.x);
  
  var midX = (line.a.x+line.b.x)/2; 
  var midY = (line.a.y+line.b.y)/2;
  
  ctx.translate(midX, midY);
  
  ctx.rotate(angle);
  ctx.scale(1,...