如何从HTML画布缩放绘图并将其复制到另一个画布？

文章/答案/技术大牛

发布

1回答

javascript、html、html5-canvas

如果我在画布上画了什么，我想按下保存，然后在保存时缩放绘图的图像，以便在页面的另一部分适合较小的画布。我认为这与绘图的base64源有关，但我不完全确定如何做到这一点。假设我画的原始画布是600px乘400px，而较小的画布是300px乘150px，那么代码会是什么样子？

浏览 30提问于2019-02-26得票数 2

1回答

我目前正试图了解如何在html5中绘制对象时如何进行矩阵转换，但是在多个不同的信息来源中发现的不同解释造成了一些混淆。我发现了这样的信息:为了像看到的那样在html5中动画绘制对象，我还看到了转换可以通过转换一个绘制点来应用于页面上的单个对象，但我不太确定它是如何工作的。代码提供了自己的moveTo()和lineTo()实现(通常与画布对象一起使用)，在这两个实现中，它转换传入的点，根据视图重新调整其位置，然后调用画布的移动版本以传递转换的点。2.在矩阵对象上调用rot

浏览 1提问于2015-10-21得票数 0

回答已采纳

3回答

如何将Google绘图画布与实际形状相匹配？

google-drawings

我有一个谷歌图纸在我的谷歌文档文件与一个巨大的画布。不过，我在图中画的形状比画布小得多。我如何告诉谷歌绘图自动缩小画布的大小，以适应我的形状？

浏览 0提问于2012-10-26得票数 19

回答已采纳

1回答

如何在响应式HTML页面上获取画布的宽度

javascript、html、css、canvas、width

我的HTML文件<canvas id="myCanvas">我的CSS FIle{ height:100%;{ height:40%;使用Javascript，我正在画布上画一个图像(1秒后重新绘制)。因此，画布宽度随着浏览器宽度的变化而变化。在ImageDraw函数中，我

浏览 0提问于2014-01-22得票数 0

回答已采纳

2回答

CSS缩放不是模糊的而是像素化的

css、zooming

我想在CSS中使用缩放属性的图像，但不想有一个模糊的效果放大的图像，而是像素化。我如何才能做到这一点？编辑:如果有必要，可以使用其他属性或其他语言。

浏览 0提问于2011-03-20得票数 6

回答已采纳

2回答

调整画布大小时，画布图会变形。

javascript、html、canvas

我正在用html5和javascript实现画布上的绘图。以下是鼠标向下事件的代码。

浏览 5提问于2015-03-09得票数 2

回答已采纳

1回答

将图像从CGContext保存到背景上

ios、swift、core-graphics、cgcontext

上下文当用户处于完全不同的场景时，我想将绘图保存到图像中(png，jpeg并不重要)，点击upload将绘图的图像发送到服务器。但我想不出如何在背景上创建上下文，从存储的数据复制绘图，然后将其导出到图像，而不将其呈现在屏幕上。当用户在<e

浏览 16提问于2022-07-14得票数 0

回答已采纳

1回答

画布拖放HTML5擦拭

html、canvas、oledragdrop

我用画布和div (canvas:chart.js / div:morris.js)绘制图表。我只是用HMTL5设置元素拖放，它工作得很好，但是当我移动画布时，它会擦去上面的所有东西。在div图上停留，但与画布无关。在我每次移动画布时，除了重绘之外，还有别的解决方案吗？

浏览 2提问于2014-06-06得票数 0

回答已采纳

1回答

将paper.js画布与“常规”画布同步

canvas、html5-canvas、paperjs

我已经在做的事：如何在缩放/平移方面同步2？我希望能够滚动&缩放View和下面的画布，这样

浏览 4提问于2015-06-02得票数 0

回答已采纳

1回答

在不同大小的纸张JS视图上显示图纸的最佳方法是什么？

paperjs

上下文目标是让每个用户都有一个绘图的缩放表示(也就是说，所有东西都适合不同大小的画布，内容不会被扭曲)。如果绘图从较大的画布转移到较小的画布，则应该是这样，反之

浏览 1提问于2020-04-30得票数 1

1回答

如何在webgl中缩放纹理？

matrix、webgl、aspect-ratio

如何在另一个大小的webgl <canvas>上进行缩放，并保持原有的高宽比？假设绘图缓冲区和画布具有相同的尺寸。

浏览 0提问于2018-09-25得票数 1

回答已采纳

1回答

如何从画布中添加和删除(多个)图像。

javascript、html、canvas

我对画布(HTML5)很陌生，我必须在画布上设计一个油漆应用程序。有一个功能，如动态添加选定的图像在画布(鼠标移动)和功能，以删除和拖动该添加的图像(相同的文本添加)。现在我的问题是如何从画布中删除图像(注:没有固定的no。添加到画布中的图像。)你能给我推荐一下方法吗?？

浏览 2提问于2012-01-06得票数 5

1回答

如何将System.Drawing.Graphics复制到另一个图形上？

.net

我们得到了一些使用Printdocument实现打印的代码，它直接在PrintEventArgs中接收的Graphics对象上完成所有绘图。如果执行绘图的代码使用另一个画布会更方便，我们将在之后将此画布添加到PrintEventArgs Graphics中。因为代码已经依赖于Graphics对象，所以我需要一个包含此对象的画布。我还需要一种方法将画布复制到PrintEventArgs Graphics上。我可以从Image创建Grap

浏览 0提问于2010-05-14得票数 0

回答已采纳

1回答

缩放后在画布上绘制

javascript、canvas、html5-canvas、zooming、draw

我正在开发一个在画布上渲染形状的HTML5应用程序。这些形状是由用户使用自由绘图绘制的。然而，一旦画布被缩放，当用户继续绘制时，线条就会带有偏移量。问题是如何平移这些点，以便在光标下再次绘制直线？

浏览 18提问于2017-02-07得票数 2

回答已采纳

1回答

Fabricjs防止在画布边界外自由划水

javascript、canvas、drawing、fabricjs

如何防止用户在画布之外自由绘制模式。这条线的一部分将画在画布之外。当鼠标在画布外移动时，我如何告诉织物停止绘图？同样，从mouse:move返回false对此没有任何影响。更新:这几乎是可行的，但它仍然很有趣.// this.canvas.isDrawingM

浏览 1提问于2017-05-18得票数 3

1回答

HTML5画布在iOS平台上的缩放问题

ios、html、canvas、cordova、scaling

其主要思想是访问电话库中保存的图片，将图片保存到HTML元素中，然后将该img元素绘制到画布上。从那里，用户可以缩放和旋转图像。我在安卓系统上没有问题。我缩放图像并记录缩小图像的比率(如果没有缩放，drawRatio是1，如果图像缩小到适合屏幕，则大于1)。PhoneGap负责从电话库抓取图片，我只需使用照片中返回的imageURI并将其设置为img元素。，我在画布右下角有一个箭头.在被拖动时，它记录它离画布左上角

浏览 4提问于2011-07-06得票数 3

回答已采纳

1回答

drawImage()实现

javascript、jquery、html、canvas

我有两张大小不同的画布。我的目标是将用户的绘图从主画布复制到第二个画布，作为缩小版本。到目前为止，drawImage()和scale似乎工作正常，但是第二个画布保留了主绘图的旧版本和新副本。如何在每次运行该函数时将当前图像复制到我的辅助画布？我还意识到scale一直在被调用；这解释了为什么新复制的图像每次都会变小，所以这可能是另一个问题。

浏览 1提问于2013-02-05得票数 0

回答已采纳

2回答

调整和缩放HTML5画布和内容的大小

javascript、html、canvas、resize、zooming

我正在开发一个应用程序，它将绘图界面(如Paint或Photoshop)合并为HTML5画布元素。我该如何最好地实现这个功能呢？

浏览 2提问于2011-08-12得票数 3

2回答

在我的画布下捕获图像的一部分

javascript、html、canvas

我想要做的是，当我保存画布中的内容时，将页面中的画布对象作为图像的一部分。我有一个应用程序，它创建一个画布，让你用鼠标在上面画画。此绘图功能已经到位，因此您可以在页面上进行绘图，就好像它们是便笺一样，因此在我保存图像或页面后，可以使用“便笺”在其上进行绘图。到目前为止，我能够保存淹没在画布中的东西，但是由于背景不是画布的一部分，所以我无法将它保存在一起。我尝试过使用html2canvas.js，但是它在我的例子中行不通，因为它需要D

浏览 3提问于2015-01-06得票数 4

回答已采纳

点击加载更多