📜  Fabric.js 多边形 strokeUniform 属性

📅  最后修改于: 2022-05-13 01:56:41.493000             🧑  作者: Mango

Fabric.js 多边形 strokeUniform 属性

在本文中,我们将了解如何使用FabricJS锁定画布多边形的统一笔触宽度,以便即使我们将对象缩放到更大的尺寸时,笔触的宽度也保持不变。画布意味着多边形是可移动的,可以根据需要进行拉伸。此外,当涉及到初始笔划颜色、填充颜色、笔划宽度或大小时,可以自定义多边形。

方法:

FabricJS JavaScript 库用于上述。使用 CDN 导入库后,我们将在body标记中创建一个画布块,其中包含我们的多边形。之后,我们将初始化 FabricJS 提供的 Canvas 和 Polygon 的实例,并使用strokeUniform属性锁定画布 Polygon 的统一笔划宽度,并在画布上渲染多边形,如下例所示。

句法:

fabric.Polygon([  
    { x: pixel, y: pixel },  
    { x: pixel, y: pixel },  
    { x: pixel, y: pixel},  
    { x: pixel, y: pixel},  
    { x: pixel, y: pixel }], {
        strokeUniform: string
    }
);

参数:此属性接受如上所述和下文所述的单个参数。

  • strokeUniform:当为“ false ”时,描边宽度将随物体缩放。当为“真”时,笔画将始终与为笔画宽度输入的确切像素大小相匹配。默认值为“假”

注意:维度像素必须创建一个多边形。

示例:下面的示例说明了 JavaScript 中的Fabric.JS Polygon strokeUniform。

HTML


  

    
    

  

    
        

            GeeksforGeeks         

                        Fabric.js | Polygon strokeUniform Property              
                           


输出: