放大画布上的悬停区域

Question

我有一个包含画布图像的Angular 1.5.5应用程序，并且我想要具有类似于（https://mlens.musings.it/）的功能。我发现了许多库，例如vanilla js和magnify.js，但是它们仅适用于img src。请让我知道如何在画布上使用magnify.js或其他任何方式来放大画布。

HTML：

    <div ng-keydown="onKeyPress($event)" tabindex="0"  >
  <canvas width=1200 height=750 id="canvas" class="rounded float-right"></canvas>
    </div>

指令：

app.directive("drawing28", function($rootScope, drawingService, annService, rsrsubmitService){
return {
        restrict: "A",
        link: function($scope, element){
angular.element(document).ready(function (){
        drawingService.setCanvas(document.getElementsByTagName('canvas')[0]);
        drawingService.setCTX(document.getElementsByTagName('canvas')[0].getContext('2d'));
        drawingService.setImage(image);
        drawingService.setScale(initialScale);
        drawingService.setScaleStep(scaleStep);