HTML 画布 - 绘图在调整大小时消失

2024-02-07

我在 HTML canvas 元素中创建了一个基本形状,效果很好。

当我调整画布大小时,会出现问题,画布中的所有绘图都会消失。这是正常行为吗?或者是否有一个功能可以用来阻止这个?

解决此问题的一种方法可能是在调整画布大小时再次调用绘图函数,但是如果要绘制大量内容,这可能不是很有效。

最好的办法是什么?

这是示例代码的链接https://gist.github.com/2983915 https://gist.github.com/2983915


调整大小时需要重新绘制场景。

设置画布的宽度或高度,即使您将其设置为与以前相同的值,不仅清除画布,而且重置整个画布上下文。任何设置的属性 (fillStyle, lineWidth、剪切区域等)也将被重置。

如果您无法从表示画布的任何数据结构中重绘场景,则始终可以通过将整个画布绘制到内存画布、设置原始宽度并绘制内存来保存整个画布本身。记忆画布回到原来的画布。

这是保存画布位图并在调整大小后将其放回的非常简单的示例:

http://jsfiddle.net/simonsarris/weMbr/ http://jsfiddle.net/simonsarris/weMbr/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

HTML 画布 - 绘图在调整大小时消失 的相关文章

随机推荐

  • 无法从 WSL2 docker 容器连接到 WSL2 本地主机服务器

    我正在运行一个简单的网络服务器https 0 0 0 0 4000 https 0 0 0 0 4000 也可以作为https local phx cd shoeping at 4000 https local phx cd shoeppi
  • 如何在 AuthenticationTokenCreateContext 中设置错误?

    我必须在 AuthenticationTokenCreateContext 中设置错误 可以使用 context SetError 在 OAuthValidateClientAuthenticationContext 中设置错误 但在 Au
  • 使用 g++ 编译 c++14 代码

    我在 Ubuntu 14 04 LTS 上使用 g 4 8 4 当尝试使用 std c 14 进行编译时 出现以下错误 g error unrecognized command line option std c 14 使用 std c 1
  • 性能监视器 .NET CLR Networking 4.0.0.0 实例命名

    我正在尝试使用性能计数器来确定我的应用程序已发送或接收的字节数 我按照此处找到的建议解决方案进行操作 计算带宽 https stackoverflow com questions 442409 c bandwidth 但我的应用程序实例没有
  • C语言AVL树

    我目前正在做一个需要使用AVL树的项目 我为 avl 编写的插入函数似乎不起作用 它最多适用于 3 或 4 个节点 我将衷心感谢您的帮助 尝试如下 Tree insert Tree t char name 80 int num if t N
  • Android 的 Flutter 签名版本未打开,但所有调试版本都工作正常?

    应用程序的调试版本工作正常 但签名的版本未打开 安装签名版本后 它显示如下 然后无法移动到应用程序的启动屏幕 我尝试了堆栈溢出上可用的所有解决方案 但对于这种情况没有任何作用 None
  • Windows 8 WinRT KeyboardCapability.KeyboardPresent 始终为 true

    我们使用 KeyboardCapability KeyboardPresent 来测试键盘是否连接到设备 bool hasKeyboard new KeyboardCapabilities KeyboardPresent 1 不幸的是 无论
  • 页面加载后 Jquery addClass

    我想知道为什么执行 jQuery 代码addClass页面渲染后的函数 我有一些元素 h1 绝对定位 该元素有规则 left 60 和简单的JS document ready function test find header find h
  • Spring Cloud Gateway 或 Zuul2,哪一个是 Zuul1 的正确替代品?

    由于 Spring Cloud 团队已经放弃了 Zuul 模块的开发 我们正在转向 Spring Cloud Gateway 或 Zuul2 但我相信 Zuul2 需要在架构上进行大量更改 并且需要在微服务上进行重大更改 如果我错了 请纠正
  • 阻止离线 iPhone Web 应用程序在 Safari 中打开链接

    我正在开发一个可以在离线模式下与移动 Safari 配合使用的网站 我可以将其添加到主屏幕上并从那里加载 但是 一旦从主屏幕打开 单击某些链接将跳出应用程序并在移动 safari 中打开 尽管我在所有链接单击上阻止了 Default 该应用
  • 维护一个与上游同步的分支

    我计划根据 github 上的项目添加一些代码 例如添加一些适合我的项目的定制选项 一个想法是分叉并创建一个分支来包含我的所有更改 每当上游有新的更改时 我都会获取它们并将其重新设置到我的分支 假设这些是我的遥控器 git remote v
  • 带有 Maven 子模块的 gradle

    有什么方法可以使用 maven 子模块构建 gradle 项目吗 我在 gradle 中创建了一个项目 但现在我必须添加模块 该模块使用了 Maven 我不知道如何使用它 有什么好的办法吗 我将非常感谢任何建议 将 Maven 项目转换为
  • XmlSerializer 和 System.Drawing.Color 的最佳解决方案

    System Drawing Color 对象显然不会使用 XmlSerializer 进行序列化 xml 序列化颜色的最佳方法是什么 最简单的方法的核心就是使用它 String HtmlColor System Drawing Color
  • 使用 Core Data 按纬度/经度查找最近的位置

    我有一个 iPhone 应用程序 其中包含一个包含位置列表的核心数据数据库 每个位置都有纬度 经度坐标 如何搜索距我当前位置最近的 10 个地点 我是核心数据新手 所以我的问题实际上是如何进行查找 我知道如何获取当前位置等 我相信我需要使用
  • Python垃圾回收如何使用numpy数组追加和删除?

    我正在尝试调整在计时器上更新的绘图代码 matplotlib 的底层结构 从使用 Python 列表绘制数据到使用 numpy 数组 我希望能够尽可能降低绘图的时间步长 并且由于数据可能会达到数千个点 如果不能的话 我就会开始快速浪费宝贵的
  • Android 媒体播放器上用于搜索栏的线程

    如何创建一个线程 每秒检查歌曲位置并根据歌曲位置移动搜索栏 我使用了打击代码 它只播放两首歌 然后它就从我的应用程序中消失了 public class setp implements MediaPlayer OnPreparedListen
  • Xamarin.Forms - 摇篮 FAB

    我想要摇篮浮动操作按钮 按钮必须是动态的 它将是动画的 并且支架必须适应它 就像从材料 io https material io 它必须与 iOS 和 Android 一样工作 XAML 示例 如果可以的话 也许是自定义渲染器 我知道这个功
  • Nodejs:如何克隆对象

    如果我克隆一个数组 我使用cloneArr arr slice 我想知道如何在nodejs中克隆一个对象 对于不需要压缩每一滴性能的实用程序和类 我经常作弊 只使用 JSON 来执行深度复制 function clone a return
  • 我可以使用 Transporter 将 Flutter iOS 应用上传到 App Store 控制台吗?

    我是通过 Flutter 进入移动开发领域的 所以我所有与原生平台和技术的接触都来自于它 到目前为止 我一直按照文档所述分发我的 Flutter 应用程序 使用 Xcode 打开 build ios archive Runner xcarc
  • HTML 画布 - 绘图在调整大小时消失

    我在 HTML canvas 元素中创建了一个基本形状 效果很好 当我调整画布大小时 会出现问题 画布中的所有绘图都会消失 这是正常行为吗 或者是否有一个功能可以用来阻止这个 解决此问题的一种方法可能是在调整画布大小时再次调用绘图函数 但是