2016-09-05 2 views
2

Ich stehe vor einigen Herausforderungen beim Skalieren einer Konva.Image. Ich möchte das Bild von seinem Mittelpunkt aus skalieren. Obwohl ich in der Lage bin, es von der Mitte aus zu skalieren, bin ich mir nicht sicher, ob es eine korrekte Vorgehensweise ist oder nicht. Derzeit ist es von seiner top-left Ecke skaliert. Um das Bild vom Mittelpunkt zu skalieren, setze ich es offset in die Mitte, indem ich image.setOffset() verwende. Aber ich weiß nicht, warum es das Bild bewegt. Ich tue dies:KonvaJS: Bild von Mitte skalieren

//setting the offset to center 
    //but don't know why it's moving the image. 
    yoda.setOffset({ 
    x: yoda.width()/2, 
    y: yoda.height()/2 
    }); 
    // setting it's position back to original 
    // position but don't know why I need to 
    // adding the offset values 
    yoda.position({ 
    x: 50 + yoda.width()/2, 
    y: 50 + yoda.height()/2 
    }); 

Um das Bild zu skalieren Ich tue dies:

yoda.scale({ 
      x: 0.5, 
      y: 0.5 
     }); 
     layer.draw(); 

Gibt es eine andere Möglichkeit, das gleiche zu erreichen? Hier ist die plunkr zu spielen.

Antwort

1

Dies ist das erwartete Verhalten von Konva Knoten. Sie müssen offset und {x,y} Eigenschaften zusammen verwenden.

Sie können die Verwendung von offset vermeiden, aber in diesem Fall müssen Sie während der Skalierung {x,y} ändern.

+0

Danke lavrton ... Scheint so, als müsste ich zuerst das Konzept des Offset lernen. Haben Sie einen Link, der es gründlich erklärt? –

+0

Ich habe auch Probleme, den Offset zur Mitte einzustellen und dann 'scaleX()' und 'scaleY()' zu verwenden. Ich habe es versucht und versucht. Ich kann es einfach nicht funktionieren. – Azevedo

Verwandte Themen