问题标签 [drawimage]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
1941 浏览

javascript - Calculate new width when skewing in canvas

I'm using canvas for a project and I have a number of elements that I'm skewing. I'm only skewing on the y value and just want to know what the new width of the image is after skewing (so I can align it with another canvas element). Check out the code below to see what I mean

The goal would be to know that the 42 by 60 image was now a X by 60 image so I could do some translating before drawing it at 0,0. It's easy enough to measure each image individually, but I have different skew values and heights/widths throughout the project that need to be align. Currently I use this code (works decently for images between 25 and 42 widths):

As images get wider though this formula quickly falls apart (I think it's a sloping formula not a straight value like this one). Any ideas on what canvas does for skews?

0 投票
1 回答
128 浏览

javascript - Chrome 问题:Chrome 未获取/绘制图像

我正在用 html 创建一个缩略图库。为了获取缩略图,我做了这样的事情

这工作正常。现在我有一个函数可以处理这些缩略图上的点击事件,类似于以下内容:

现在我在 HTML 画布上绘制 nextImage 对象

ctx.drawImage(nextImage, 0, 0, 100, 130); 整个代码适用于 mozilla firefox,但不适用于 google chrome。似乎 chrome 没有再次向服务器发送 nextImage 对象的 src 属性的请求。任何替代解决方案?

0 投票
0 回答
179 浏览

html - 未捕获的错误:仅 iPad 上的 INDEX_SIZE_ERR

我在一个应用程序中绘制了一些画布,它在每个浏览器中都运行良好(除了明显的 ie7/8),但我还必须让它在 iPad 上运行。当我在 iPad 上查看调试控制台时,我看到了这个错误:

INDEX_SIZE_ERR:DOM 异常 1:索引或大小为负数,或大于允许值

我查看了此处有关该错误的其他一些线程,但似乎没有一个适用于已回答(尤其是因为我在桌面版本上也没有看到此错误)。

错误发生在这部分代码中:

对于日志,我得到的所有正数和宽度/高度都是正确的。largeImage 指的是作为 HTML 标记一部分的图像,因此我认为在尝试绘制之前未加载图像不是问题(并且如上所述,宽度/高度日志正确,所以我假设这是不是问题)。

任何人都知道为什么会在 iPad 上而不是在桌面上发生这种情况?

0 投票
2 回答
346 浏览

java - 图像不会绘制到动画

在 Java 小程序中加载/显示图像时出现问题。不确定我是否错误地加载了图像,或者我是否错误地访问了它。这是绘制船和背景的代码(这是一个类似小行星的游戏)。背景绘制正确,但船没有。这是我正在处理的主要类方法:

我在类的开头创建了一个 ship 类的实例。但是,如果我尝试在方法中实例化船类(例如“Ship ship = new Ship();”),它会说从未使用过变量“ship”。

这是整个船级:

如果我按原样运行它,它运行没有错误,但它不显示船。如果我尝试在除顶部以外的其他任何地方创建船的实例,它会给我一个 NullPointerException。

更新

这是我的整个主要课程:

0 投票
1 回答
1206 浏览

javascript - Windows 7 中的 HTML5 Canvas drawImage 问题,但仅在 Firefox 中

我正在开发的程序有问题(您可以在www.energematrice6.com/gview2看到它)

星系查看器在 6 个不同的图层上绘制星星。后层工作正常(使用简单的笔划命令)。顶部 3 层使用 drawImage() 功能获取保存的图像并将其绘制到画布上(使用函数 starGradDraw 和 starGradDraw2)。

当程序第一次执行并保存到对象变量(基本上只是一个缓冲区)时,这些图像是由另一个函数创建的。

在我的家用电脑、笔记本电脑、我妻子的电脑以及我测试过(或让朋友测试过)的几乎所有其他机器上,一切正常。

当我尝试在我的工作电脑上用 Firefox 10.0.2 打开它时(我在家里使用的相同版本),前三层星星是空白的。我能想到的唯一其他区别是我的家用电脑都没有使用 64 位操作系统,特别是 Windows 7。

程序中的其他所有内容似乎仍然可以正常工作,并且 firebug 没有弹出任何错误。它只是不绘制图像(或停止程序)。我真的不确定下一步该尝试什么。

有任何想法吗?

(如果你愿意,我可以粘贴一些代码,但程序有超过一千行长,我不确定问题可能出在哪里,或者它如何只在这台机器上出错。)

0 投票
1 回答
5965 浏览

html - HTML5画布drawImage在第一次点击时不起作用

我有一个画布,我正在使用一个 javascript 函数来显示文本和几张图像。我遇到的问题是单击确实执行了功能并显示了文本,但并不总是放置图像。如果再次单击,则会出现图像。这种行为在所有浏览器中都是一致的。该命令并不慢,只是第一次显示图像失败。TIA

0 投票
1 回答
899 浏览

javascript - 为什么 drawImage 在 Safari 中的执行速度比 Chrome 或 Firefox 快得多?

为了好玩,我制作了一个小的 HTML 画布可视化工具,我注意到它在 Chrome 中运行非常糟糕,在 Firefox 中非常糟糕,但在 Safari 中绝对令人惊讶,包括 iPhone 和 iPad!

谁能解释为什么?

我认为代码应该相当简单,但基本上我正在为鼠标(或触摸)位置绘制点,然后使用 drawImage 将画布复制到临时画布。从那里我清除显示画布,然后将临时画布复制回来(4 次),但应用一些东西,如旋转、偏移、透明度和缩放(并使用一些不同的 globalCompositeOperations),所有这些都使用 drawImage。所以总的来说,drawImage 在每个循环中被调用 5 次。

您可以在此处查看演示:http: //lakenen.com/vis.html

任何见解将不胜感激!

PS。如果可以的话,在 iPad 上试试这个;多点触控非常简洁:)

0 投票
2 回答
859 浏览

c# - 在 Draw image 中动态设置 x 和 y 坐标

我正在使用 DrawImage 调整图像大小。

这里源图像从坐标 0 开始。
假设我需要动态计算 x 和 y 坐标,我该怎么做?
默认情况下,图像应从位置 20(即 x)和 20(即 y)开始。
如果我调整表格的大小,它应该根据调整后的图像按比例计算,这意味着,如果默认是 20,那么表格调整大小是多少?

谢谢

0 投票
1 回答
452 浏览

qt - QPoint 不是 (0,0) 时的 QPainter::drawImage

QPainter::drawImage 有问题。我有 KameleonVNC 小部件可以将我的应用程序访问到 VNC 服务器。我已经把它放在 QFrame 上。但它在左上角绘制图像,我不喜欢这样。我刚刚看了代码,看到来自 VNC 服务器的图像QPainter::drawImage,坐标为 0,0QPoint(0,0)QRect坐标为 0,0。但是当我将坐标更改为其他坐标时,我得到了不可预测的结果。我知道它只在图片发生变化的地方绘制小图片。但我不明白如何用drawImage修复这个错误。

0 投票
2 回答
30091 浏览

java - 如何在另一个图像上绘制图像?

我有一个关于随机城市交通网络模拟的 Java 项目,我设法找到了实现这个项目的方法,所以我将每个交叉路口分成一个基本上是扩展 JPanel 类(名为 Carrefour)的部分。 .一切都很好,直到我陷入如何绘制车辆并让它们通过道路为止。

所以我的问题是如何在另一个图像(道路)上绘制图像(车辆图像)?