javascript - 如何绘制开放线或未闭合路径 pixi.js

标签 javascript canvas pixi.js

我正在尝试使用 6px 彩色描边在 Canvas 上绘制一条锯齿形线,没有填充。然而,形状始终是闭合的,并将不需要的线连接回原点。如何防止 pixi.js 关闭路径。

  @line = new PIXI.Graphics
  @line.lineStyle(6, color)
  stage.addChild(@line)

  @line.moveTo markX,markY

  for row, col in rows
    @line.lineTo(@getSymbolX(col)-spanDistance, @getSymbolY(row))
    @line.lineTo(@getSymbolX(col)+spanDistance, @getSymbolY(row))

  @line.lineTo(@getSymbolX(4) + 60, @getSymbolY(rows[4]))
  @line.lineStyle(0, color)

enter image description here

PIXI 3.07 has introduced a bug https://github.com/pixijs/pixi.js/issues/1892 a workaround solution is to use the following graphics.currentPath.shape.closed = false

最佳答案

试试这个:

@line.currentPath.shape.close = false;

https://github.com/pixijs/pixi.js/issues/2014

编辑:或者在 2022 年:

graphics.currentPath.closeStroke = false;

关于javascript - 如何绘制开放线或未闭合路径 pixi.js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31783903/

相关文章:

javascript - 动态表内的按钮仅执行一次 JQuery 函数

html - 我们需要自己用 <canvas> 实现双缓冲吗?

javascript - Canvas ,沿弧线从一个点移动到另一个点

javascript - 是否有 HTML/JavaScript canvas 元素的测试套件?

javascript - Phaser/Pixi 法线贴图过滤器不工作

javascript - 在循环 Angular2 中创建多个元素

javascript - 防止歌剧鼠标手势

javascript - 当检测到某个最小屏幕分辨率大小时,如何通过 Javascript 更改 CSS 属性

javascript - 如何在javascript上将对象属性绑定(bind)到this关键字?

pixi.js - PIXI.js-如何绘制半个圆?