如何撤消绘图？制作一个秒表，当它更新时文本会重叠
撤消绘图可以通过以下步骤实现：
- 首先，需要获取绘图的上下文（context），可以是HTML5的Canvas或其他绘图库提供的接口。
- 在绘制每一帧之前，保存当前的绘图状态，可以使用context.save()方法。
- 当需要撤消绘图时，可以使用context.restore()方法将绘图状态恢复到上一次保存的状态。
- 如果需要多次撤消绘图，可以将每次保存的绘图状态存储在一个栈中，每次撤消时从栈中取出上一次保存的状态进行恢复。
下面是一个示例代码，演示如何使用JavaScript和HTML5的Canvas制作一个撤消绘图的功能：
<!DOCTYPE html>
<html>
<head>
<title>撤消绘图示例</title>
<style>
canvas {
border: 1px solid black;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="400" height="400"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var states = []; // 保存绘图状态的栈
function saveState() {
states.push(context.getImageData(0, 0, canvas.width, canvas.height));
}
function restoreState() {
if (states.length > 0) {
context.putImageData(states.pop(), 0, 0);
}
}
function drawCircle(x, y, radius) {
context.beginPath();
context.arc(x, y, radius, 0, 2 * Math.PI);
context.fillStyle = "red";
context.fill();
context.closePath();
}
function clearCanvas() {
context.clearRect(0, 0, canvas.width, canvas.height);
}
function undo() {
restoreState();
clearCanvas();
redraw();
}
function redraw() {
for (var i = 0; i < states.length; i++) {
context.putImageData(states[i], 0, 0);
}
}
canvas.addEventListener("mousedown", function(event) {
saveState();
var rect = canvas.getBoundingClientRect();
var x = event.clientX - rect.left;
var y = event.clientY - rect.top;
drawCircle(x, y, 20);
});
document.addEventListener("keydown", function(event) {
if (event.key === "z" && event.ctrlKey) {
undo();
}
});
</script>
</body>
</html>以上代码创建了一个画布，当鼠标在画布上点击时，会在点击位置绘制一个红色的圆。按下Ctrl+Z组合键可以撤消上一次绘制的圆。每次绘制圆时，都会保存当前的绘图状态，撤消时将上一次保存的状态恢复并重新绘制。
相关·内容
2回答
我正在制作一个可以工作的秒表，但当它改变时，文本会重叠，因为它会重复绘制文本。如果我从间隔中删除strokeText和fillText，则它不会更改。它保持不变。如何使函数撤消自身，或删除间隔开始处的文本？graph.fillText(gameTime, 50, 50);}
代码说明: gameTimeSeconds是冒号右边的秒，分钟在左边，<
浏览 26提问于2017-12-31得票数 0
1回答
我正在做秒表，当我想第二次重置时钟的时候，它没有改变。在第一次单击时，它设置h: 0，m: 0，s: 0。但是当再次单击时，它没有设置h: 0，m: 0，s: 0，秒表继续前进。
浏览 1提问于2021-05-18得票数 0
回答已采纳
4回答
现在我想让它变得更长，意思是从旧的线中画出另一条线。这样做时，新旧线条之间的匹配点会变得不那么透明(因为它们现在由两条线组成)。因此，我想取消对旧线的描边，然后对新线进行描边。谢谢
浏览 14提问于2011-07-09得票数 5
回答已采纳
1回答
当页面加载时，文本会在字体加载之前绘制到画布上，但很明显，一旦字体加载，画布上的文本就不会更新，因为它已经被绘制为位图。
如何将此文本绘图推迟到加载Web字体之后？一个矩形也被绘制到画布上，我仍然想立即在$(document).ready()上绘制。我应该说，我想延迟.fillText()，而不是覆盖默认字体，因为它是一个面向设计的应用程序，并且FOUT会对美学产生负面影响。
浏览 4提问于2015-03-28得票数 6
回答已采纳
我需要添加典型的手指绘图到一个应用程序。很难相信，在这个时代，我必须从头开始编程？
很难相信没有一个通用的解决方案？Review：这是几行代码的一个(编写得很好)示例片段，就是如何使用路径绘制，并且效果很好。它工作得很完美，但它只是为了画出一条“道路”。例如，你不能用一种以上的颜色画一幅画。没有撤销或诸如此类的。它是一个似乎写得很好的类，声称它可以做撤消、颜色、擦除等等，
浏览 2提问于2013-11-25得票数 5
回答已采纳
我正在尝试更新一个现有的Excel文件(xlsx)。我不介意存储临时文件。
浏览 3提问于2019-12-20得票数 3
回答已采纳
2回答
我正在制作一个自定义控件来绘制我的模拟。问题是，当不断地使它失效(这是必要的，因为每次勾选时，绥靖性都会改变)，它会阻止其他控件被绘制(例如，只要我用鼠标拖动模拟中的对象，属性网格就不会更新)。窗口窗体的绘图是如何工作的？同样，当窗体上有此控件的两个实例时，第一个实例将阻止第二个实例。所以只有一个被画出来，而另一个却是空的。
这里有谁做过复杂的用户控件吗？我不能使用其他的渲染机制，因为该程序应该在办
浏览 4提问于2014-04-18得票数 0
回答已采纳
2回答
在这段代码中，我能够设置线条的宽度和颜色，但当我尝试使用链接在其中包含撤消/重做特性时，我发现这非常困难，它在撤消重做上工作得很好，但它的徒手操作并不流畅。经过一些研究和编码，我知道是绘图的问题，我认为这是防止撤消/重做的原因。在第一个链接中有一个文件"CachedLIView.h/m“，当我使用这个文件并尝试在其中包含undo/redo时，我发现在以下方法中：
- (void)touchesEnded:(NSSet *)touches，
浏览 0提问于2012-12-06得票数 4
回答已采纳
1回答
我试图制作一个“实时”的时间序列图，在这个序列中，这个序列在循环中被更新。这似乎是一个流行的问题，因为有许多问题解决这个问题，但我还没有找到“干净”的解决方案。我要强调的是，我不是在尝试制作动画，它是在循环结束时制作的。我想在循环运行时更新这个情节。我看过，但我认为这需要我事先知道系列大小，这在我的应用程序中不是这样的。再说一次，也许我误解了包裹。首先，我不知道这是否只是VSCode的一个问题，也不知道该指向谁，但是将display(p)放在函数中以<
浏览 20提问于2022-02-06得票数 1
1回答
为什么我会在展示会上闪烁
、、、
我正在开发一个简单的操作系统，并且在输出中遇到了一些闪烁问题(请参阅)。除了记忆的问题之外，我还不知道是什么原因造成了这种情况。
浏览 4提问于2022-07-20得票数 0
回答已采纳
22回答
我正在为一个民用工程应用程序编写一个结构建模工具。我有一个代表整个建筑的巨大模型类，其中包括节点、线元素、负载等的集合，这些也是自定义类。我已经编写了一个撤销引擎，它会在每次修改模型后保存一个深度副本。现在我开始思考我是否可以用不同的方式编写代码。也许我可以保存每个修饰符操作的列表，而不是保存深层副本，并保存相应的反向修饰符。这样我就可以将反向修饰符应用于要撤消的当前模型，或者将修饰符应用到要重做的模型。
我可以想象你将如何执行简单的命令来改变对象的属性，等等。但是复杂
浏览 0提问于2008-09-08得票数 123
回答已采纳
1回答
画布碰撞
、
我是javascript的新手，正在尝试找出如何与球和木板进行碰撞，这将停止游戏，并以类似于"You lost“的方式提醒玩家。但我只想让红色的球打在木板上，蓝色的球在不接触的情况下传球。
浏览 0提问于2016-08-15得票数 3
1回答
我制作了一个函数，用户可以选择一个图并用一个按钮进行验证。我得到了包裹ID。当点击按钮时，地图被更新，并且只有绘图多边形使用滤镜进行着色： map.addLayer({ 'in',
'ID_P
浏览 40提问于2020-04-02得票数 0
1回答
我的问题是:现在我正在创建一个缩放函数，并将缩放和平移转换应用到绘图视图中，任何在缩放时完成的绘图都会出现在错误的位置(它在屏幕上手指所在的位置上和左边)和错误的大小(较小)。在撤消和重做之前，您实际上无法看到您正在绘制的是什么。我认为屏幕外上下文或屏幕的矩形正在更新，或者存储在撤消历史记录中的路径点由于转换而具有不同的起源/引用点(不知道该如何称呼它！)。这是我的第一个iOS应用程序(可能有一些愚蠢的错误)，我已经使用了许
浏览 2提问于2014-11-19得票数 0
abbreviation或下划线分隔词，例如：underscore_separated_wordsunderscore_separated_words的情况下以与hyphen-separated-words相同的方式制作replace的缩写？我如何将这两个步骤结合起来？我有一个内部使用的d3条形图。我的字体很大。有些xA
浏览 0提问于2018-04-30得票数 1
回答已采纳
1回答
我正在制作一个包含用CGPath元素绘制的图形的UIView动画[UIView beginAnimations:nil contextmyView.frame=CGRectMake(0,0,0,768);这在我第一次运行这段代码时工作得很好，但是我无法在以后使用setNeedsDisplay时强制更新当我执行代码时，动画按预期发生，但它总是显示我发送的第一个图形。在更新视
浏览 0提问于2012-02-14得票数 0
回答已采纳
4回答
我正在开发另一个画布应用程序，它比屏幕大很多倍。关于如何做到这一点，我需要一些建议/指导。
基本上，我想要的是滚动这个大画布，只在可见区域绘图。
浏览 4提问于2012-04-20得票数 2
回答已采纳
1回答
创建协作白板绘图应用程序
、、、、
我有自己的绘图程序在适当的地方，与各种“绘图工具”，如钢笔，橡皮擦，矩形，圆，选择，文本等。因此，我有一个很好的代码库，我可以将协作绘图连接到其中。一个</
浏览 0提问于2010-05-23得票数 6
回答已采纳
1回答
背景它注册鼠标和触摸事件，处理所有的绘图和保存。我不知道如何有效地存储它，其中的“高效”意味着快速和准确(就像它存储整条线一样准确)。线可以存储，但手绘的项目我还没有弄清楚。这里有一个例子来说明这一点：
drawings.You
浏览 2提问于2021-04-19得票数 1
回答已采纳
1回答
当然，备份缓冲区的内容将在某个时候被复制到frontbuffer中，否则WebGL绘图将不会产生用户可见的效果！
我们当前呈现的图像从来都不是在画布上显示的，这怎么可能呢？
浏览 0提问于2019-05-25得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
云直播活动推荐
腾讯云开发者
