将 HTML5 画布序列转换为视频文件
我想将 HTML5 画布中的动画转换为可以上传到 YouTube 的视频文件.是否有任何类型的屏幕捕获 API 或可以让我以编程方式执行此操作的东西? 解决方案 有一个 whammy 库声称可以使用 JavaScript 从静止图像中生成 webm 视频: http://antimatter15.com/wp/2012/08/whammy-a-real-time-javascript-w
..
canvas相关内容
网格与画布
我正在寻找有关在 WPF 中使用 Canvas 与 Grid 面板的意见.我需要制作具有基本网格布局的经典输入表单，有些可能内部有小数据网格、组框，但都在网格布局中对齐.我正在为我的所有表单使用网格还是画布面板而苦苦挣扎.网格给了我良好的结构；我可以更轻松地保持控件的对齐方式.我将为所有窗口提供基类(继承 Window 类)，因此 Visual Studio 中的设计器将毫无用处，因为它存在这种继
..
使用 <canvas> 绘制的网格看起来被拉伸的元素
我正在尝试在 元素上绘制网格，最终目标是制作 围棋板. 由于某种原因，网格看起来被拉伸了，线条粗于 1 个像素并且间距完全错误.它甚至没有从 (10,10) 位置开始.. 如果有人可以看看告诉我我做错了什么，那就太好了. http://jsfiddle.net/h2yJn/ 解决方案 我找到了问题所在.当您实际上必须设置宽度和高度属性时，我正在使用 CS
..
带有网格的 tkinter 画布滚动条?
Tkinter 和 Python 相对较新.所以请多多包涵. 我正在尝试显示以下 GUI，并希望在 Frame2 中有一个滚动条，以一次仅显示 5x5 个按钮.看起来 Tkinter 框架不支持滚动条，因此在父框架“FMas"中添加了一个画布(框架嵌入其中)和一个滚动条.但由于某种原因，滚动条会转到屏幕的右端并且不进行任何滚动. 画布不应该在 Frame2 的边缘结束并且滚动条就在它旁
..
我将 X Y Z 坐标转换为屏幕 X Y 坐标有什么问题?
我正在做一个 HTML5 Canvas 演示，演示在 3D 空间中弹跳的球体.这很简单.每个球都有 X、Y 和 Z 坐标.然后将这些坐标转换为我在此处阅读的屏幕 X 和 Y 坐标.http://answers.google.com/answers/threadview/id/496030.html 我从上面的链接中得到的将 X Y Z 坐标转换为 X 和 Y 的公式是 screenX =
..
分组和取消分组 Fabric.js 对象
我使用 fabric.js 创建了一种“多边形选择器"或“多边形制造器".每次单击都会创建多边形的一个角，可以选择、移动等...双击原点“关闭"多边形.在这一点上，我将构成多边形的所有圆/线分组并将它们分组.到目前为止一切顺利. 当双击这样的组时，我希望它取消组合并恢复为可移动节点(即移动圆圈会重塑多边形等)；但是发生了一些奇怪的事情 - 看看当你移动圆圈时会发生什么，某些线似乎“没有加入"
..
使用 javascript 中的 mousemove 事件在画布内的图像上绘制矩形
我正在尝试使用 mousemove 事件在画布内的图像上绘制一个矩形.但是由于 clearRect ，我在图像上得到了矩形，矩形中填充了颜色.谁能弄清楚我.如何在图像上绘制一个只有边框的矩形.下面是我实现它的代码. var canvas = document.getElementById('canvas'),ctx = canvas.getContext('2d'),矩形 = {}，拖动=假
..
在画布上绘制(渐进式)油漆飞溅
我正在寻找一种简单的方法，它可以让我在画布上绘制 paint splash 像这样: 一种方法是发射很多小粒子，这会画一个小圆圈，但我不想管理很多粒子对象. 编辑:示例: jsfiddle.net/MK73j/4/ 第二种方法是使用少量图像并控制缩放和旋转，但我希望效果具有良好的随机性. 第三种方法是制作一些随机的小点，用贝塞尔曲线连接它们并填充内容，但我只有一个标记.
..
用“羽毛"剪裁帆布边缘效应
我目前正在将图像绘制到 HTML5 画布上并用弧线对其进行遮罩，在绘制图像之前调用 clip() 以便仅显示弧线中的部分.我怎样才能使这条弧的边缘羽化?我通过谷歌搜索知道没有简单的方法可以简单地将“羽毛"应用到用画布绘制的形状上.边缘接触弧线的图像的像素数据是什么?感谢您的帮助. 这是我的代码的相关部分: ctx.arc(canvas.width/2, canvas.height/2, 2
..
用于 UI 小部件的 HTML5 画布库
我一直在寻找一个库，它可以帮助嵌入在画布区域中的 UI 小部件的呈现和功能，例如组合框、复选框、单选按钮、文本区域、带有滚动条的列表框等，而无需通过将它们浮动在画布区域的顶部来叠加普通的 HTML 元素.Flex 为 Flash 提供了所有这些功能，并且有许多 Actionscript 库可以在 Flash“画布"(可以这么说)中创建 UI 小部件组件.这些 UI 小部件库在某些情况下为 Flas
..
nodejs - 如何将文件中的图像数据添加到画布中
下面的代码应该读取一个图像文件，然后在 Canvas 模块的帮助下将文件数据添加到画布中. 当我运行此代码时，我收到错误消息图像未定义.我尝试从我简单导入的模块初始化的图像对象吗? var http = require('http'), fs = require('fs'),画布 = 要求('画布');http.createServer(function (req, res) {fs.re
..
需要加速我的 SVG.我可以转换为 WebGL 或画布吗?
我有一个包含 10138 个部分的 SVG 绘图，所以它运行缓慢. 我想让它运行起来更像 http://workshop.chromeexperiments.com/globe 这是我正在考虑的解决方案/问题 有什么方法可以让 SVG 部件以处理器密集度较低的方式呈现? 我可以将 SVG 转换为 WebGL 或画布吗? 我可以让它作为 SVG 运行，但通过 WebGL 或画布呈现
..
调整矩形 HTML5 画布的大小
我有一些函数可以在画布元素上绘制矩形.绘制元素时，我希望能够通过拖动它的角来调整它的大小. var canvas = document.getElementById('canvas'),ctx = canvas.getContext('2d'),矩形 = {}，拖动=假；函数初始化(){canvas.addEventListener('mousedown', mouseDown, false
..
HTML5 Canvas - 在 Canvas 上绘图，保存上下文并稍后恢复
要求: 现在:在 Canvas 上绘图，然后点击 Save(离线存储 Canvas 状态/绘图 - 但不作为图像). 稍后:打开先前保存的绘图显示的画布，并继续再次绘制. 对于绘图，我们通常使用如下代码: canvas = document.getElementById('can');ctx = canvas.getContext("2d");...ctx.beginPath();
..
如何从数组中的图像源创建画布图像?
我想从来自我的 ajax 请求的数组中的多个图像创建一个 Canvas 图像；为此，我尝试运行循环，但 drawImage 不适用于循环. 然后我尝试了一个函数，并在循环中调用了该函数，但同样的事情发生了 drawImage 不适用于此 下面我提到了所有的代码一和函数一的循环 &一个在 drawImage 中具有静态信息的当前工作. 如果有人请指导我如何解决此问题，我将不胜感激.
..
在画布上绘制 HTML5 视频 - Google Chrome 崩溃，Aw Snap
我用mp4文件源画了一个视频HTML5，为了改进 css 样式和所有内容，我像许多 Javascript 开发人员一样，每隔 20 毫秒将视频的帧图像重绘到画布上， 关于 w3schools 的示例:最后的绘图示例 如果你在 IE10 或 firefox 上显示它会显示一切正常，但是当我在 Chrome 上显示它时(我的是最新版本 31)，一段时间后它会崩溃(aw snap！)
..
如何检查两个绘图(线)是否在 Canvas 中碰撞?
所以我一直在开发一款奔跑的火柴人游戏.不幸的是，我遇到了一个我似乎无法弄清楚的问题.如果名为障碍物的绘图穿过我的火柴人，我希望出现警报并说“游戏结束".但是，如果我的火柴人踢了(他变成了红色)并且障碍物右脚碰到了图纸，那么它会说“你赢了".任何帮助将不胜感激！ 以下是我到目前为止的内容:顺便说一句，我考虑检查障碍物通过的给定像素是否为红色，然后说“你赢了"，但这似乎不起作用. $(docu
..
如何检查鼠标单击是否在 JavaScript 中 HTML5 Canvas 上的旋转文本内?
我在画布上以 X、Y 坐标绘制了一个文本并保存了它们.我有一个简单的方法来检查是否在文本边界内发生了鼠标单击.问题是当我将文本旋转 45 度时，我无法检查旋转后的文本中是否发生了鼠标点击. 简而言之，如何检查鼠标点击是否在旋转的文本或形状内? 解决方案 创建一个与文本同角度旋转的矩形对象，但不绘制. 然后使用: //在此处设置转换.//添加表示文本区域的矩形:ctx.begi
..
我如何“写作"上下文画布中的图标?
这是我的字体: @font-face {font-family: "myicon";/*...*/} 我的图标在 css 中的内容是: content: "\e000"; 我的 Js 代码: ctx.font = '13.5pt myicon';ctx.fillText("\ue000",90, 101);//不工作 你能解释一下问题出在哪里吗?为什么不打印图标?(对不起我的英语不
..
在 Fabric.js 中按宽度/高度在另一个画布对象内居中和缩放画布对象
目标:通过 Fabric.js 或通过 Javascript 保持原始对象的纵横比相同，但又不超过父对象的宽度/高度比例? 父对象(矩形或组)不会以 canvas 元素为中心. 这是我到目前为止的代码:https://stackblitz.com/edit/angular-my8hky 我的 app.component.ts 到目前为止: canvas: fabric.Canv
..