Maison >interface Web >js tutoriel >Comment définir la hauteur d'un triangle à l'aide de FabricJS ?
Dans ce tutoriel, nous apprendrons comment définir la hauteur d'un triangle à l'aide de FabricJS. Triangle est l'une des différentes formes fournies par FabricJS. Afin de créer un triangle, nous devons créer une instance de la classe Fabric.Triangle et l'ajouter au canevas.
Nous pouvons manipuler l'objet triangle en changeant sa position, son opacité, son trait et ses dimensions. FabricJS nous permet de contrôler la taille des objets en utilisant les propriétés width et height.
new Fabric.Triangle({ height: Number }: Object)
Height - Cette propriété accepte une valeur number qui nous permet de spécifier la hauteur de l'objet. Sa valeur par défaut est 100.
heightComportement par défaut de la propriété
Regardons un exemple de code pour comprendre le comportement par défaut de la propriété height.
高度属性的默认行为 请注意,默认三角形的高度为 100。 // 启动画布实例 var canvas = new Fabric.Canvas("canvas"); canvas.setWidth(document.body.scrollWidth); 画布.setHeight(250); // 初始化一个三角形对象 var triangle = new Fabric.Triangle({ 左:105, 顶部:70, 宽度:90, 填写:“#746cc0”, 笔画:“#967bb6”, 笔划宽度:5, }); // 将其添加到画布中 canvas.add(三角形);
Passage de l'attribut height comme clé
Maintenant que nous avons une valeur de 140px attribuée à l'attribut height, nous pouvons voir sa hauteur changer.
将高度属性作为键传递 您可以看到三角形的高度现在固定为 140。 // 启动画布实例 var canvas = new Fabric.Canvas("canvas"); canvas.setWidth(document.body.scrollWidth); 画布.setHeight(250); // 初始化一个三角形对象 var triangle = new Fabric.Triangle({ 左:105, 顶部:70, 宽度:90, 身高:140, 填写:“#746cc0”, 笔画:“#967bb6”, 笔划宽度:5, }); // 将其添加到画布中 canvas.add(三角形);
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!