在没有画布的情况下获取

在没有画布的情况下获取

本文介绍了JavaScript:在没有画布的情况下获取 ImageData的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

是否可以从不在画布上而是在 DOM 树中的其他位置作为普通 <img> 的图像获取 ImageData 对象?

Is it possible to get an ImageData Object from an image which is not on the canvas but somewhere else in the DOM tree as a normal <img> ?

如果是,如何?

推荐答案

您必须在内存中创建一个画布,然后在该画布上绘制图像:

You have to create an in memory canvas and then draw on this canvas the image :

var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
var img = document.getElementById('myimg');
canvas.width = img.width;
canvas.height = img.height;
context.drawImage(img, 0, 0 );
var myData = context.getImageData(0, 0, img.width, img.height);

但是如果图像来自另一个域,这将不起作用.如果您无法控制服务器,则这是一个无法绕过的安全限制(请注意,如果您使用 file://打开 html 文件,则会有很多其他限制,请使用 http://)

But this won't work if the image comes from another domain. This is a security restriction you can't get around if you have no control of the server (be careful that if you open your html file with file:// you'll have a lot of additional restrictions, use http://)

这篇关于JavaScript:在没有画布的情况下获取 ImageData的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-15 13:57