Schräg rechts/links Leinwand Textobjekt mit Fabric js

Question

Wie Sie Leinwandtextobjekt mit Fabric js nach rechts und schräg nach links geneigt machen? Screenshots dafür.

For slant right

And for slant left

jede Hilfe sehr dankbar.

Answer 1

auf Stoff js Version Je Sie verwenden, können Sie Skew Unterstützung haben aus der Box: (1.6.0-rc +)

var canvas = new fabric.Canvas('canvas'); 
 

 
var textLeft = new fabric.Text('13-arid-365',{ 
 
    left:100, 
 
    top: 25, 
 
    skewX: 45  
 
}); 
 
canvas.add(textLeft); 
 

 
var textRight = new fabric.Text('13-arid-365',{ 
 
    left: 100, 
 
    top: 75, 
 
    skewX: -45  
 
}); 
 
canvas.add(textRight);

<script src='http://www.deltalink.it/andreab/fabric/fabric.js'></script> 
 
<canvas id="canvas" width=300 height=300></canvas>

Unterschied zwischen transformMatrix und Skew-Funktion ist Dieser Skew wird besser unterstützt und ermöglicht eine kohärente Begrenzungsbox, während die Transformationsmatrix dies nicht tut.