2009-03-25 4 views
3

Vous pouvez échantillonner des données de couleur de pixel sur une image de canevas avec getImageData(). Si je superpose un élément de canevas transparent sur une image d'arrière-plan ou un film instantané, puis-je en échantillonner une couleur via la balise canvas?Javascript - obtient des données de pixel de l'image sous l'élément de toile?

+0

Cette question est peut-être pertinente (et j'essaie de résoudre le même problème): http://stackoverflow.com/questions/2754865/how-to-get-the-rgb-value-of-an-image -in-a-page-using-javascript –

Répondre

5

Phil a raison, vous ne pouvez pas le faire. Canvas, par conception, ne renvoie que ses propres données de pixels intrinsèques, et non aucun contenu rendu à l'écran provenant d'autres éléments.

Vous pouvez créer un élément de canevas couvrant toute la page et capturant une image de l'écran rendu.

Si possible, il s'agirait d'une faille de sécurité inter-site. Vous pouvez iframez un site cible (en utilisant les cookies/l'authentification/l'intranet de l'utilisateur pour y accéder), puis en aspirez le contenu pixel par pixel.

2

Je ne pense pas. Vous obtiendriez la couleur de la toile à ce moment-là. J'ai trouvé la méthode document.defaultview.getComputedStyle(element,pseudoElt), mais sur un div de 1 pixel sans arrière-plan, il est retourné 'transparent'.

Donc, malheureusement, cela peut être impossible à l'heure actuelle. Quel est votre objectif de niveau supérieur? Nous pourrions être en mesure de trouver un itinéraire alternatif. «J'ai eu une idée plus tôt pour copier des données d'image dans un objet javascript: vous pouvez créer un élément de canevas couvrant toute la page et capturant une image de l'écran rendu. peut-être ".

Si cela ne vous dérange pas que ce soit une image statique, il ya un excellent site Web qui le fait pour vous: Browser Shots. Il génère des captures d'écran de votre site Web fonctionnant dans une vaste gamme de différents navigateurs.

+0

J'ai eu une idée plus tôt pour copier des données d'image dans un objet javascript. Vous pouvez créer un élément de canevas couvrant toute la page et capturant une image de l'écran rendu. Une fois que vous avez ces données, vous pourriez peut-être effectuer des tests croisés dans le monde réel. – Geuis

+0

J'ai ajouté une note à la réponse au sujet du site Web browsershots, qui devrait faire ce que vous pensez d'une manière simple et agréable. –

Questions connexes