jCanvas - zoom in/reset/out

HTML

<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jcanvas/16.7.3/jcanvas.js"></script>
<button value="1.25">Zoom in</button>
<button value="1">Zoom reset</button>
<button value="0.8">Zoom out</button>

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

JavaScript

var canvas = $('canvas');

// Add rectangle layer
canvas.addLayer({
	name: 'canvas',
	type: 'rectangle',
	x: 0,
	y: 0,
	width: 100,
	height: 100,
	fillStyle: '#000099',
 	strokeStyle: '#000099'
});

// Draw the layers
canvas.drawLayers();

// On a button click scale the canvas
$('button').on('click', function() {
	var zoomLevel = $(this).val();
  
	canvas.scaleCanvas({
  		scale: zoomLevel
	}).drawLayers().restoreCanvas();
});