canvas 相关问题

Canvas是自由格式图形输出的通用元素。

FabricJS 触摸平移/缩放整个画布

我需要在 FabricJS 画布上启用触摸缩放/平移。有一些库允许在图像上执行此行为(请参阅捏缩放画布)或通过鼠标单击事件(请参阅此小提琴),但我不能

回答 3 投票 0

为什么当我添加值时我的对象不改变位置

函数形状(x,y){ 这个.x...</desc> <question vote="1"> <pre><code>&lt;hmtl&gt; &lt;head&gt; &lt;!--&lt;script src=&#39;main.js&#39;&gt;&lt;/script&gt;--&gt; &lt;/head&gt; &lt;body&gt; &lt;canvas id=&#39;myCanvas&#39;&gt; &lt;/canvas&gt; &lt;script&gt; function shape(x,y){ this.x=x; this.y=y; var canvas = document.getElementById(&#34;myCanvas&#34;); var ctx = canvas.getContext(&#34;2d&#34;); ctx.fillStyle = &#34;#FF0000&#34;; ctx.fillRect( this.x, this.y, 50, 50); } } var sqr=new shape(100,100) sqr.x+=100 &lt;/script&gt; &lt;/body&gt; &lt;/hmtl&gt; </code></pre> <p>为什么我向 x 添加 100 并希望它的位置为 (200,100) 但当我打开实时服务器时它的位置仍然保持 (100,100)</p> </question> <answer tick="true" vote="1"> <p>因为它只会改变 x 的值,所以你必须在画布上再次绘制它,并且在再次绘制之前我们必须使用clearRect 清除画布</p> <p></p><div data-babel="false" data-lang="js" data-hide="false" data-console="true"> <div> <pre><code>&lt;html&gt; &lt;head&gt; &lt;!--&lt;script src=&#39;main.js&#39;&gt;&lt;/script&gt;--&gt; &lt;/head&gt; &lt;body&gt; &lt;canvas id=&#39;myCanvas&#39;&gt; &lt;/canvas&gt; &lt;script&gt; function shape(x,y){ this.x=x; this.y=y; var canvas = document.getElementById(&#34;myCanvas&#34;); var ctx = canvas.getContext(&#34;2d&#34;); this.draw = ()=&gt;{ ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.fillStyle = &#34;#FF0000&#34;; ctx.fillRect( this.x, this.y, 50, 50); ctx.stroke(); } } var sqr=new shape(100,100) sqr.draw(); sqr.x+=-100 sqr.draw(); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt;</code></pre> </div> </div> <p></p> </answer> </body></html>

回答 0 投票 0

获取任何变换后的空间坐标的单位矩阵等效坐标

ctx.setTransform(12,0,0,12,34,23) ctx.fillText("a",0,0) 是否有可能在单位矩阵变换空间中获得“a”的等效坐标。 我想确定 char &q...

回答 1 投票 0

如何检查<canvas>正在使用哪种上下文类型? (2D、WebGL)

当您在网页上看到 元素时,有什么超级快速的方法来查找它是使用 2d 还是 WebGL 上下文创建的?

回答 1 投票 0

如何检查 Canva 上下文类型? (2D、WebGL)

当您在网页上看到 Canvas 元素时,有什么超级快速的方法来查找它是使用 2d 还是 WebGL 上下文创建的?

回答 1 投票 0

drawArc() `在 jetpack compose 的 DrawScope 中工作?

其实我正在读这篇文章。我对 startAngle 的工作和 drawArc() 中的弧线方向感到非常困惑,有人能解释一下吗? 我读过很多我浪费了的答案......

回答 1 投票 0

在 Firefox 的 Canvas 中绘制线条时的抗锯齿

我正在尝试用画布绘制图表,并希望获得清晰的线条,而不是抗锯齿。我知道你需要使用 0.5 偏移量来使线条精确地落在屏幕像素上,但即使如此,我...

回答 3 投票 0

如何更改已在 Python3 Kivy 中绘制的矩形的颜色?

我正在尝试了解如何使用 Kivy - 特别是画布。我或多或少了解了如何移动和调整我已经绘制的矩形的大小,但我无法让矩形改变...

回答 1 投票 0

在 html 画布中获取光栅化文本

我有一个主画布,在上面画了另一个画布,上面写着文字。当我看到结果时,文本似乎被光栅化并且不平滑。 这是我尝试过的代码:- 常量

回答 1 投票 0

将图像从 webgl 复制到 2D 画布会丢失 Safari 中的显示 P3 颜色配置文件

我在使用 Safari 时遇到了一个奇怪的问题,即将图像从 webgl 移动到 2d 不尊重显示 P3 颜色配置文件。它在 Chrome 中运行良好。 任何帮助将不胜感激。 这是...

回答 1 投票 0

如何使用 PDF.js 和 CSS 保留倒置 pdf 文档上的图像颜色?

我的目标是使用 PDF.js 库读取 pdf 文件,并以黑色背景和白色文本的深色模式显示 pdf,并保留文档中图像的原始状态。 与他...

回答 1 投票 0

使用 javascript Base64 编码动画 gif

我正在开发一个模因生成器,它允许用户在他们选择的模因模板的顶部和底部输入文本。在我当前的系统中,我有一些 html 元素堆叠在...

回答 2 投票 0

如何放大和缩小画布中的文字大小,tkinter python

我创建了一个画布小部件并添加了一些对象,例如矩形和文本。 我还在鼠标滚轮上绑定了缩放功能。它适用于矩形;但是,它不适用于文本...

回答 3 投票 0

获取 tkinter Canvas 的高度/宽度

我已经找这个很久了。在 tkinter 中获取 Canvas 的高度/宽度有这么难吗? 我想做这样的事情: c = Tk.Canvas(自身,高度=12,宽度=12) c.create_oval(0, 0, 自我.

回答 3 投票 0

缩放div时如何保持div为父容器的100%?

我正在尝试使用 div 构建一个类似画布的元素。 我有一个充当画布的 div 元素,该 div 元素可以缩放和平移。此 div.canvas 元素放置在容器内。我很痛...

回答 1 投票 0

是否可以更改 HTML5 中画布图像的 dpi?

我了解到Canvas图像一般有96 dpi。是否可以更改Canvas图像数据的dpi。我可以说将 96 dpi 图像转换为 200 dpi 吗?提前致谢。我看...

回答 1 投票 0

将图像拖动到 html 画布以创建这些图像的克隆

是否有任何链接或教程可以使图像可拖动并克隆到 html 画布中?我总是找到绘制线条或画笔的教程,但有没有一种方法可以专门拖动图像并克隆...

回答 1 投票 0

存储 HTML 画布图像的最小方式是什么?

我正在尝试制作一个像素艺术动画师,您可以在其中制作像素艺术,但也可以对其进行动画处理,但问题是我希望画布占据我的大部分屏幕,只有一点点空间......

回答 1 投票 0

存储 html 画布图像的最小方式是什么

我正在尝试制作一个像素艺术动画师,您可以在其中制作像素艺术,但也可以对其进行动画处理,但问题是我希望画布占据我的大部分屏幕,只有一点点空间......

回答 1 投票 0

将 Slack 消息转换为任务列表项

我想利用 Slack 中的新 Canvas 功能。 有没有人找到一种方法来进行对话并将其转换为另一个频道中的任务列表项? 先感谢您。 我有

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.