获取HTML5 canvas元素

我一直在寻找图片src属性值 - 在想什么，我想做的事情是不可能的，但想到我会检查。获取HTML5 canvas元素

我有一个HTML页面上的几个画布如下：（下面这些标识）

canvasMain - 这是要显示一个大版本的图像的
canvasThumbnail1 - 这是怎么回事到显示缩略图
canvasThumbnail2 - 同上 ...等

我有它活像国王在那里我画的画布主要与缩略图的内容。问题是因为画布立即将画布复制到canvasThumbnail的canvasMain中。这导致放大的像素化图像。

我想要做的是点击其中一个canvasThumbnails，并能够将Image.src属性作为字符串获取，然后将其拉到canvasMain中，而不是实际上将像素从一个画布复制到另一个画布。基本上只需抓住地图（本地或在Flickr上说）就可以从图像中拉出。将图像拉入画布似乎很好地缩放它。

从我所看到的，我不认为Image.src值是通过2D上下文访问。我通过它的属性枚举，只发现嵌套的对象或本机代码返回。

我想如果我点击canvasThumbnail，然后使用（this）获取对该canvas元素的引用，然后获取该canvas的2dcontext，我可能可以使用该上下文的属性来获取代表Image.src值的字符串。

任何想法？谢谢

来源

2011-05-03 Tom

不知何故，你把图像绘制到canvasThumbnail1，大概是从（高分辨率）图像元素。

的canvasThumbnail1，或任何与此有关的画布，对事情画上它没有记忆。因此，如果您将大图像绘制到小画布上，则高分辨率数据不会存在于该小画布上。为了得到它，你必须再次使用原始图像，否则你必须从一开始就画到更大的画布。

换句话说，而不是画的缩略图到主，你需要重新绘制的图像元素（即你用来制作缩略图）到主。

来源

2011-05-03 14:23:14

是的，这是正确的。我创建了一个画布，然后获取了上下文。然后我用Image.src创建了一个图像对象，这是一个高分辨率图像。基本上我希望能够创建一个缩略图，然后点击它在更大的画布上显示它。 – Tom 2011-05-03 16:17:11

因此，所有你需要做的就是从Image对象绘制两次 – 2011-05-03 16:23:15

是的，正确的。我创建了一个画布，然后获取了上下文。然后我创建了一个Image.src的图像对象，这是一个高分辨率的图像，并将其绘制到画布上。基本上我希望能够创建一个缩略图，然后点击它在更大的画布上显示它。我希望可能有一个可用的属性，可以让我从URI中提取图像，而不是将像素复制过来。我用它做了一些测试，看到画布可以很好地缩放任何尺寸的图像。我只是想验证我自己必须为此编写代码。谢谢。 – Tom 2011-05-03 16:23:45

获取HTML5 canvas元素

回答

相关问题