Fabric.js 折线cornerDashArray 属性

Fabric.js是一个用于创建交互式Canvas应用程序的Javascript库，其支持图形的绘制、操控和交互等功能。其中，折线cornerDashArray属性是一种用于设置折线角落的虚线宽度和间距的属性。

属性值

cornerDashArray属性是一个数组类型，其成员个数必须为偶数，并且每对成员表示一个虚线宽度和一个间隔。默认值为null，表示不使用虚线。

line.set({
    cornerDashArray: [5, 5],
});

使用示例

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

var line = new fabric.Line([50, 50, 200, 50], {
    stroke: 'black',
    strokeWidth: 5,
    cornerDashArray: [5, 5],
});

canvas.add(line);

效果展示

注意事项

• 该属性只对拐角处有效果；
• 在使用虚线时，建议能够合理设置虚线的宽度和间隔，避免过于密集或者过于稀疏导致效果不佳。

参考资料

• fabric.Line