当前位置: 首页 > 知识库问答 >
问题:

画布怎么截图?[副本]

郑博
2023-03-14

共有1个答案

百里成仁
2023-03-14

这取决于您的框架,但基本上您可以使用canvas.todataurl()

下面是一个完整的示例

<!DOCTYPE HTML>
<html>
  <head>
    <style>
      body {
        margin: 0px;
        padding: 0px;
      }
    </style>
  </head>
  <body>
    <canvas id="myCanvas" width="578" height="200"></canvas>
    <script>
      var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');

      // draw cloud
      context.beginPath();
      context.moveTo(170, 80);
      context.bezierCurveTo(130, 100, 130, 150, 230, 150);
      context.bezierCurveTo(250, 180, 320, 180, 340, 150);
      context.bezierCurveTo(420, 150, 420, 120, 390, 100);
      context.bezierCurveTo(430, 40, 370, 30, 340, 50);
      context.bezierCurveTo(320, 5, 250, 20, 250, 50);
      context.bezierCurveTo(200, 5, 150, 20, 170, 80);
      context.closePath();
      context.lineWidth = 5;
      context.fillStyle = '#8ED6FF';
      context.fill();
      context.strokeStyle = '#0000ff';
      context.stroke();

      // save canvas image as data url (png format by default)
      var dataURL = canvas.toDataURL();
    </script>
  </body>
</html>

dataUrl将包含图像,您可以将其保存在任何您想要的地方。

 类似资料:
  • 请问这种拓扑图如何画呢?纯css好实现吗?

  • 可在游戏中等拍摄并保存任何场景。同时按下PS键和START键。 可从(照片)查看已保存的信息。 若要拍摄画面截图,需事先将PS Vita专用存储卡插入主机。 因画面或应用程序的状态,可能无法拍摄画面截图。

  • 图表画布 由一个画布和一个工具栏组成,让你设计图表,例如添加对象、设置图表格式和打印模型等。一个模型文件可以有多个图表。在模型中,每一个图表是由一个选项卡来表示。若要创建一个新的图表,从模型的菜单选择 文件 -> 新建图表。 创建表 要创建一个新的表,从图表工具栏点击 按钮和点击画布的任何位置。 你可以从浏览器的模型选项卡添加一个现有的表,简单地从模型选项卡拖放表到画布。 如果图表符号设置为默认,

  • 问题内容: 我这里有一个尺寸为2156x1728的黑白png文件,我想使用AffineTransform旋转90度。生成的图像比例不正确。这是一些示例代码(假设我已将png文件成功加载到BufferedImage中): 输出如下: 输入宽度:2156 输入高度:1728 结果宽度:1942年 身高:1942 旋转如何返回如此完全无关的尺寸? 问题答案: 我不是专业人士,但是为什么不创建一个正确大小

  • 我试图创建一个自定义视图,工作简单:有一个位图显示由弧路径-从0deg到360deg。度随着一些fps而变化。 我的问题是--如何设置模式以使其工作透明? 当然,是32位PNG,带有alpha通道。

  • 我不知道咋拦截,我想不修改源代码的情况下进行拦截增强,我发现使用cglib需要手动使用Enhancer#create()方法创建一个代理类,手动调用才能触发Callback的钩子函数