如何创建一个从数组中收集值以作为参数传递的计数器？

Question

我为按钮分配了一个函数，该函数执行用于缩放的外部库方法。

<div *ngIf="isPremium" class="zoom-in" (click)="zoomIn()"><i class="icon-search-plus"></i>>/div>

该方法只支持库自己建立的三个参数。宽度、高度和执行缩放增量的第三个数字。

  zoomIn() {
    const $container = $('.container');
    this.instance = panzoom($container[0], {
      smoothScroll: false,
      zoomSpeed: 0.015

    });
    const width = document.querySelector('.container').getBoundingClientRect().width / 2;
    const height = document.querySelector('.container').getBoundingClientRect().height / 2;   
    this.instance.smoothZoom(width, height, 2);

  }

我试图将一个值数组作为第三个参数直接传递，但它返回了一个错误（错误错误：缩放需要有效数字）。我理解它 returns 的错误是因为它只允许一个单一价值。每次按下按钮时，如何传递一个值数组而不是第三个参数来执行渐进式缩放增量？预先感谢您的帮助

 const width = document.querySelector('.container').getBoundingClientRect().width / 2;
    const height = document.querySelector('.container').getBoundingClientRect().height / 2;  
const possibleZooms = [1.2, 1.4, 1.8, 2]; 
    this.instance.smoothZoom(width, height, possibleZooms);

Answer 1

好吧，定义一个保存当前缩放值的变量，每次增加它：

var currentZoom = 0;
zoomIn() {
    const $container = $('.container');
    this.instance = panzoom($container[0], {
      maxZoom: 2,
      minZoom: 0.4,
      smoothScroll: false,
      zoomSpeed: 0.015
      pinchSpeed: 0.015,
      bounds: true,
      boundsPadding: 0.05,
      beforeWheel(e) {
        const shouldIgnore = !e.altKey;
        return shouldIgnore;
      },
      zoomDoubleClickSpeed: 1,
      transformOrigin: {x: 0.5, y: 0.5}
    });
    const width = document.querySelector('.container').getBoundingClientRect().width / 2;
    const height = document.querySelector('.container').getBoundingClientRect().height / 2;   
    this.instance.smoothZoom(width, height, ++currentZoom);
}

我用0作为第一个值，但我不知道是不是这样。现在，每次按下按钮，缩放值都会增加。如果缩放有最大值，你可以这样做：

...
currentZoom = min(maxZoom, currentZoom + 1);
this.instance.smoothZoom(width, height, currentZoom);

这样，当currentZoom等于maxZoom时，就不再增加了。

现在，如果您有多个可以放大的对象，您需要为每个个组织当前状态，但我将其留给您。

希望这对您有所帮助。

如何创建一个从数组中收集值以作为参数传递的计数器？

how to create a counter that collects values from an array to pass as a parameter?

javascript

arrays

parameters

increment

zooming