473,320 Members | 1,900 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Access to <img> pixels

If I create an image thus:

var myImg = new Image ();

I can then do the following:

myImg.src = "someimage.jpg";

But, I can't seem to find a way to manipulate the pixels of the image in
myImg (say, to invert each one).

Equally, if I have image data that I have read in from a database
record, I don't seem to find a way to stuff that directly into myImg.

Is this all actually the case or have I overlooked something?
Jun 27 '08 #1
5 2155
* Tim Streater wrote in comp.lang.javascript:
>If I create an image thus:

var myImg = new Image ();

I can then do the following:

myImg.src = "someimage.jpg";

But, I can't seem to find a way to manipulate the pixels of the image in
myImg (say, to invert each one).

Equally, if I have image data that I have read in from a database
record, I don't seem to find a way to stuff that directly into myImg.

Is this all actually the case or have I overlooked something?
This is all actually the case, you might want to look at SVG or the
proposals around "<canvas>". You could also use the 'data' URL scheme
and manipulate the string to manipulate the pixels, as an example,
http://www.bjoernsworld.de/temp/gif-...-in-js.html.gz
does just that.
--
Björn Höhrmann · mailto:bj****@hoehrmann.de · http://bjoern.hoehrmann.de
Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de
68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/
Jun 27 '08 #2
In article
<1k********************************@hive.bjoern.ho ehrmann.de>,
Bjoern Hoehrmann <bj****@hoehrmann.dewrote:
* Tim Streater wrote in comp.lang.javascript:
If I create an image thus:

var myImg = new Image ();

I can then do the following:

myImg.src = "someimage.jpg";

But, I can't seem to find a way to manipulate the pixels of the image in
myImg (say, to invert each one).

Equally, if I have image data that I have read in from a database
record, I don't seem to find a way to stuff that directly into myImg.

Is this all actually the case or have I overlooked something?

This is all actually the case, you might want to look at SVG or the
proposals around "<canvas>". You could also use the 'data' URL scheme
and manipulate the string to manipulate the pixels, as an example,
http://www.bjoernsworld.de/temp/gif-...-in-js.html.gz
does just that.
Now this, might be just what the doctor ordered.

Thanks - I shall give that scheme a try!
Jun 27 '08 #3
VK
On May 27, 5:13 pm, Tim Streater <tim.strea...@dante.org.ukwrote:
In article
<1k1o34tl0men0ov9o4d0q6g4k6lk9tf...@hive.bjoern.ho ehrmann.de>,
Bjoern Hoehrmann <bjo...@hoehrmann.dewrote:
* Tim Streater wrote in comp.lang.javascript:
>If I create an image thus:
var myImg = new Image ();
>I can then do the following:
myImg.src = "someimage.jpg";
>But, I can't seem to find a way to manipulate the pixels of the image in
>myImg (say, to invert each one).
>Equally, if I have image data that I have read in from a database
>record, I don't seem to find a way to stuff that directly into myImg.
>Is this all actually the case or have I overlooked something?
This is all actually the case, you might want to look at SVG or the
proposals around "<canvas>". You could also use the 'data' URL scheme
and manipulate the string to manipulate the pixels, as an example,
http://www.bjoernsworld.de/temp/gif-...-in-js.html.gz
does just that.

Now this, might be just what the doctor ordered.

Thanks - I shall give that scheme a try!
Being warned that neither of IE versions supports that so Web-wide the
solution will work only for 10-20% of your visitors depending on the
world region. Can be not important for an intranet solution but
important to know for an open project.
Jun 27 '08 #4
In article
<c9**********************************@r66g2000hsg. googlegroups.com>,
VK <sc**********@yahoo.comwrote:
On May 27, 5:13 pm, Tim Streater <tim.strea...@dante.org.ukwrote:
In article
<1k1o34tl0men0ov9o4d0q6g4k6lk9tf...@hive.bjoern.ho ehrmann.de>,
Bjoern Hoehrmann <bjo...@hoehrmann.dewrote:
* Tim Streater wrote in comp.lang.javascript:
If I create an image thus:
var myImg = new Image ();
I can then do the following:
myImg.src = "someimage.jpg";
But, I can't seem to find a way to manipulate the pixels of the image in
myImg (say, to invert each one).
Equally, if I have image data that I have read in from a database
record, I don't seem to find a way to stuff that directly into myImg.
Is this all actually the case or have I overlooked something?
This is all actually the case, you might want to look at SVG or the
proposals around "<canvas>". You could also use the 'data' URL scheme
and manipulate the string to manipulate the pixels, as an example,
>http://www.bjoernsworld.de/temp/gif-...-in-js.html.gz
does just that.
Now this, might be just what the doctor ordered.

Thanks - I shall give that scheme a try!

Being warned that neither of IE versions supports that so Web-wide the
solution will work only for 10-20% of your visitors depending on the
world region. Can be not important for an intranet solution but
important to know for an open project.
Thanks for the heads-up. This would be for a closed user group so I may
have some flexibility.
Jun 27 '08 #5
On May 27, 6:00 am, Tim Streater <tim.strea...@dante.org.ukwrote:
If I create an image thus:

var myImg = new Image ();

I can then do the following:

myImg.src = "someimage.jpg";

But, I can't seem to find a way to manipulate the pixels of the image in
myImg (say, to invert each one).

Equally, if I have image data that I have read in from a database
record, I don't seem to find a way to stuff that directly into myImg.

Is this all actually the case or have I overlooked something?
It seems like this is something you could achieve with a Java applet.
Jun 27 '08 #6

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

15
by: Philipp Lenssen | last post by:
My friend has the following problem (background: we want to transform XML to XHTML via XSLT): "We copy XHTML fragments into an output by using the following template: <xsl:template match="*"...
5
by: MyndPhlyp | last post by:
I've been busting my head trying to figure this out for quite some time. With IE6 and NS7, no problems. I can simply code the HTML <img height="100%"> and be done with it. But NS4 and NS6 (and...
9
by: Wladimir Borsov | last post by:
As well known for <IMG ...> tags in web pages a width and a height attribute can be applied. What I want to do now is to fix the width for ALL the images on my web page to exactly lets say 70 pixel...
15
by: Gérard Talbot | last post by:
Hello all, I'd like to know and understand the difference between, say, <img src="/ImageFilename.png" width="123" height="456" alt=""> and <img src="/ImageFilename.png" style="width:...
3
by: Henry Johnson | last post by:
Okay - I'm spinning my wheels on this one... can someone help me figure out how to programmatically populate a table cell as follows (from C# code-behind)? I've tried using a Literal control in the...
1
by: Carl | last post by:
Hi all I have a javascript function that drags and drops an element (ie img) into a container (ie bordered div). The function works and returns the element and and container. My next step is to...
4
by: SammyBar | last post by:
Hi all, I wonder is it possible to upload the content of an <imgfield to a server. The content of the <imgwas downloaded from a web site different from the one it should be uploaded. The image...
4
by: bgold12 | last post by:
Hey, I've come across a strange behaviour that shows itself in IE 7.0 and Firefox 3 and probably other browsers. In the code below, which is a complete HTML document which validates as XHTML 1.0...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.