- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我在 Canvas 上画线时遇到一点问题,
基本上我希望线条漂亮、柔软且半不透明,但 Canvas 似乎只想对最后渲染的线段执行此操作。
看看这里,您会看到最后绘制的线段很好,而且..我想要它)但是随着动画的播放,之前绘制的线段变得参差不齐。
我注意到,如果我使用 closepath,这不会发生,但是,由于间隔/动画,我不能在每次渲染时都使用它,因为线条到处都是:
任何人对如何阻止这种情况发生有任何想法,我将不胜感激。
非常感谢一个
最佳答案
奇怪的代码!动画很简洁,虽然这样做的方式看起来有点独特,所以让我们看一下。
首先要完全清楚,当您创建一条路径时,您可以继续一遍又一遍地抚摸它。
因此,如果您有一条包含三个线段 A、B、C 的路径,并且您这样做:
A,中风,B,中风,C,中风
您将获得 A 段 3 次、B 段 2 次和 C 段 1 次。
这基本上就是您在这里所做的。
您可以通过在路径的末尾仅划一次来轻松避免这种情况:
这会停止动画,但会说明问题所在。您可以通过清除屏幕来修复动画。因此,对于分割市场 ABC,我们将执行以下操作:
A、清晰、中风、B、清晰、中风、C、清晰、中风
然后,您将对 A 段进行一次描边,然后清除屏幕,然后对 A-B 段进行一次描边,最后一次清除屏幕,因此对 A-B-C 段进行一次描边。这就是您想要的。
问题在于清除屏幕意味着清除所有之前绘制的形状!看这里:
有几种方法可以解决这个问题:
要完成#3,我们要做的就是不要在每个新部分的开头调用 beginPath
。相反,我们只在开始时调用一次 beginPath
,每个新部分都只是一个 moveTo
操作!
这应该足以让您走上正确的轨道!
关于javascript - Canvas 锯齿状边缘问题与线条/笔画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9483390/
我正在开发一个基于fabricjs 的图表工具。我们的工具有我们自己的形状集合,它是基于 svg 的。我的问题是当我缩放对象时,边框(描边)也会缩放。我的问题是:如何缩放对象但保持笔触宽度固定。请检查
我在 Canvas 上画线时遇到一点问题, 基本上我希望线条漂亮、柔软且半不透明,但 Canvas 似乎只想对最后渲染的线段执行此操作。 看看这里,您会看到最后绘制的线段很好,而且..我想要它)但是随
也许这是一个错误,但请检查一下。 https://codepen.io/Firsh/pen/LegGQq /* Only these work:*/ /* symbol{ overflow: visi
我已经在终端中启动了一个 python 脚本(该终端已关闭)并将其发送到后台。现在这个程序需要一些来自键盘的输入并一直等待。如何将输入“y\n”(字母“y”后跟一个 Enter)发送到该程序?假设它的
我想实现这样的效果: 有人知道如何在 Canvas 上画这样一条线吗? 最佳答案 再靠近一点: chalkPaint = new Paint(); chalkPaint.setStyl
我建立了一个very simple Twitter Instant Search为了好玩,使用 jQuery 和 PHP。我将一个事件绑定(bind)到搜索表单上的 keyup,并对 PHP 页面进行
使用通用 Windows 平台 (UWP) 使用 InkCanvas 控件 我似乎无法确定在使用 InkCanvas 时删除墨迹笔划的正确方法 - 有一个可以处理的事件“StrokeErased”。
我是一名优秀的程序员,十分优秀!