dist/cropper.common.js
function zoomTo(ratio, pivot, _originalEvent) {
    var options = this.options,
        canvasData = this.canvasData;
    var width = canvasData.width,
        height = canvasData.height,
        naturalWidth = canvasData.naturalWidth,
        naturalHeight = canvasData.naturalHeight;


    ratio = Number(ratio);

    if (ratio >= 0 && this.ready && !this.disabled && options.zoomable) {
      var newWidth = naturalWidth * ratio;
      var newHeight = naturalHeight * ratio;

      if (dispatchEvent(this.element, EVENT_ZOOM, {
        originalEvent: _originalEvent,
        oldRatio: width / naturalWidth,
        ratio: newWidth / naturalWidth
      }) === false) {
        return this;
      }

      if (_originalEvent) {
        var pointers = this.pointers;

        var offset = getOffset(this.cropper);
        var center = pointers && Object.keys(pointers).length ? getPointersCenter(pointers) : {
          pageX: _originalEvent.pageX,
          pageY: _originalEvent.pageY
        };

        // Zoom from the triggering point of the event
        canvasData.left -= (newWidth - width) * ((center.pageX - offset.left - canvasData.left) / width);
        canvasData.top -= (newHeight - height) * ((center.pageY - offset.top - canvasData.top) / height);
      } else if (isPlainObject(pivot) && isNumber(pivot.x) && isNumber(pivot.y)) {
        canvasData.left -= (newWidth - width) * ((pivot.x - canvasData.left) / width);
        canvasData.top -= (newHeight - height) * ((pivot.y - canvasData.top) / height);
      } else {
        // Zoom from the center of the canvas
        canvasData.left -= (newWidth - width) / 2;
        canvasData.top -= (newHeight - height) / 2;
      }

      canvasData.width = newWidth;
      canvasData.height = newHeight;
      this.renderCanvas(true);
    }

    return this;
  }
function zoomTo(ratio, pivot, _originalEvent) {
    var options = this.options,
        canvasData = this.canvasData;
    var width = canvasData.width,
        height = canvasData.height,
        naturalWidth = canvasData.naturalWidth,
        naturalHeight = canvasData.naturalHeight;


    ratio = Number(ratio);

    if (ratio >= 0 && this.ready && !this.disabled && options.zoomable) {
      var newWidth = naturalWidth * ratio;
      var newHeight = naturalHeight * ratio;

      if (dispatchEvent(this.element, EVENT_ZOOM, {
        originalEvent: _originalEvent,
        oldRatio: width / naturalWidth,
        ratio: newWidth / naturalWidth
      }) === false) {
        return this;
      }

      if (_originalEvent) {
        var pointers = this.pointers;

        var offset = getOffset(this.cropper);
        var center = pointers && Object.keys(pointers).length ? getPointersCenter(pointers) : {
          pageX: _originalEvent.pageX,
          pageY: _originalEvent.pageY
        };

        // Zoom from the triggering point of the event
        canvasData.left -= (newWidth - width) * ((center.pageX - offset.left - canvasData.left) / width);
        canvasData.top -= (newHeight - height) * ((center.pageY - offset.top - canvasData.top) / height);
      } else if (isPlainObject(pivot) && isNumber(pivot.x) && isNumber(pivot.y)) {
        canvasData.left -= (newWidth - width) * ((pivot.x - canvasData.left) / width);
        canvasData.top -= (newHeight - height) * ((pivot.y - canvasData.top) / height);
      } else {
        // Zoom from the center of the canvas
        canvasData.left -= (newWidth - width) / 2;
        canvasData.top -= (newHeight - height) / 2;
      }

      canvasData.width = newWidth;
      canvasData.height = newHeight;
      this.renderCanvas(true);
    }

    return this;
  }
function zoomTo ( ratio , pivot , _originalEvent ) { var options = this . options , canvasData = this . canvasData ; var width = canvasData . width , height = canvasData . height , naturalWidth = canvasData . naturalWidth , naturalHeight = canvasData . naturalHeight ; ratio = Number ( ratio ) ; if ( ratio >= 0 && this . ready && ! this . disabled && options . zoomable ) { var newWidth = naturalWidth * ratio ; var newHeight = naturalHeight * ratio ; if ( dispatchEvent ( this . element , EVENT_ZOOM , { originalEvent : _originalEvent , oldRatio : width / naturalWidth , ratio : newWidth / naturalWidth } ) === false ) { return this ; } if ( _originalEvent ) { var pointers = this . pointers ; var offset = getOffset ( this . cropper ) ; var center = pointers && Object . keys ( pointers ) . length ? getPointersCenter ( pointers ) : { pageX : _originalEvent . pageX , pageY : _originalEvent . pageY } ; // Zoom from the triggering point of the event canvasData . left -= ( newWidth - width ) * ( ( center . pageX - offset . left - canvasData . left ) / width ) ; canvasData . top -= ( newHeight - height ) * ( ( center . pageY - offset . top - canvasData . top ) / height ) ; } else if ( isPlainObject ( pivot ) && isNumber ( pivot . x ) && isNumber ( pivot . y ) ) { canvasData . left -= ( newWidth - width ) * ( ( pivot . x - canvasData . left ) / width ) ; canvasData . top -= ( newHeight - height ) * ( ( pivot . y - canvasData . top ) / height ) ; } else { // Zoom from the center of the canvas canvasData . left -= ( newWidth - width ) / 2 ; canvasData . top -= ( newHeight - height ) / 2 ; } canvasData . width = newWidth ; canvasData . height = newHeight ; this . renderCanvas ( true ) ; } return this ; }
Zoom the canvas to an absolute ratio
@param {number} ratio - The target ratio.
@param {Object} pivot - The zoom pivot point coordinate.
@param {Event} _originalEvent - The original event if any.
@returns {Cropper} this
Zoom the canvas to an absolute ratio