Dynamically putting binary images into an HTML page
Hi all,
I have the following tough one.
I have this DHTML page with some <IMG> tags on it.
While I can change the images within using imgId.src="path..." easily enough. I have some prety good reasons not to do it this way.
What I would like to do is get a chunk of binary data to the browser, separate it into several smaller chunks (each containing one image data) and put this data into my IMG elements.
The target browser is IE5.0 and up only.
The target server is IIS 5.0 and up.
However all this has to be done using JavaScript and any "safe for scripting" ActiveXs that already exist on the user's machine (i.e. no downloads or scary security dialogs, no Java either).
I assume the first part - getting the binary data into the browser can be accomplished using the XMLHTTP object to transfer binary data, although I'm not sure about the specifics.
The second part of how to put this data into the HTML page has got me completely stumped, although I've been told it can be done.
Thanks.
I have the following tough one.
I have this DHTML page with some <IMG> tags on it.
While I can change the images within using imgId.src="path..." easily enough. I have some prety good reasons not to do it this way.
What I would like to do is get a chunk of binary data to the browser, separate it into several smaller chunks (each containing one image data) and put this data into my IMG elements.
The target browser is IE5.0 and up only.
The target server is IIS 5.0 and up.
However all this has to be done using JavaScript and any "safe for scripting" ActiveXs that already exist on the user's machine (i.e. no downloads or scary security dialogs, no Java either).
I assume the first part - getting the binary data into the browser can be accomplished using the XMLHTTP object to transfer binary data, although I'm not sure about the specifics.
The second part of how to put this data into the HTML page has got me completely stumped, although I've been told it can be done.
Thanks.
third
listening....
you cannot put binary chunks straight away into the browser, those binary chunks will have to be stored as files and then be put into the html page by <img>.
so since you need to read and write from and into files directly, it will HAVE TO be done server side.
so dont accept a good client side solution, pls comment if server side suits you, and if yes pls. tell which server side language.
so since you need to read and write from and into files directly, it will HAVE TO be done server side.
so dont accept a good client side solution, pls comment if server side suits you, and if yes pls. tell which server side language.
ASKER
Nope,
the reason I'm doing all this is to prevent the round trip to server for EACH image (and there are many of them).
the reason I'm doing all this is to prevent the round trip to server for EACH image (and there are many of them).
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Preventing round trip is an illusion.
Beside that embedding image data in html is not possible it would not bring any advantage. The small amount of extra protocol overhead to fetch single images (hundred on a page is not unusual) is good investment to keep the page dynamic because the images are cached by browser. Even worse with one big html: if some of the images are equal content you have to transfer them with every page update; with single images you can use same image several times on same page and it will be transferred only once.
Regards,
zvonko
Beside that embedding image data in html is not possible it would not bring any advantage. The small amount of extra protocol overhead to fetch single images (hundred on a page is not unusual) is good investment to keep the page dynamic because the images are cached by browser. Even worse with one big html: if some of the images are equal content you have to transfer them with every page update; with single images you can use same image several times on same page and it will be transferred only once.
Regards,
zvonko
ASKER
Avner,
seems like a nice partial solution to my problems.
One problem I have with this one, is that in some scenarios I have many small images, on my page and if I combine them to a huge image, and then clip, I'm worried that it might affect the browser's memory consumption, and rendering performance. There are other problems with this one.
seems like a nice partial solution to my problems.
One problem I have with this one, is that in some scenarios I have many small images, on my page and if I combine them to a huge image, and then clip, I'm worried that it might affect the browser's memory consumption, and rendering performance. There are other problems with this one.
Eyal,
I can not assure this, but I presume that if you will use the same object for the image, you won't face any memory issues :
a= new Image();
a.src=blalala.gif
then get the images from your page and clip the image into them :
document.getElement("place
document.getElement("place
document.getElement("place
document.getElement("place
But it's a guess, I am not sure how to verify it.
I can not assure this, but I presume that if you will use the same object for the image, you won't face any memory issues :
a= new Image();
a.src=blalala.gif
then get the images from your page and clip the image into them :
document.getElement("place
document.getElement("place
document.getElement("place
document.getElement("place
But it's a guess, I am not sure how to verify it.
ASKER
Avner,
seems like a nice partial solution to my problems.
One problem I have with this one, is that in some scenarios I have many small images, on my page and if I combine them to a huge image, and then clip, I'm worried that it might affect the browser's memory consumption, and rendering performance. There are other problems with this one.
seems like a nice partial solution to my problems.
One problem I have with this one, is that in some scenarios I have many small images, on my page and if I combine them to a huge image, and then clip, I'm worried that it might affect the browser's memory consumption, and rendering performance. There are other problems with this one.
eyal_mt, are we getting somewhere here ?
ASKER
Avner,
again its a partial solution so if I don't get anything better I'm probably going to use this one, but for now I would rather wait.
again its a partial solution so if I don't get anything better I'm probably going to use this one, but for now I would rather wait.
listening..
lexxwern is correct.
There is *NO* facility in the HTML DOM, nor anything implemented on the side by Mark Andressen et al., which allows anything like :-
document.images.image.bitm
There is of course, in IE, Vector Markup Language, which you can use to construct pictures like graphs and such.
That being said, you could always make a COM object, which you embed in the page (probably many times) and use a bit of Javascript to load an XML file into a created XML DOM, extract the pictures from the XML tree and shove them into the COM objects.
Frankly its hardly worth it.
However, you think it is a problem. That implies something special about your pages. Are all these images little spacers or similar?
There is *NO* facility in the HTML DOM, nor anything implemented on the side by Mark Andressen et al., which allows anything like :-
document.images.image.bitm
There is of course, in IE, Vector Markup Language, which you can use to construct pictures like graphs and such.
That being said, you could always make a COM object, which you embed in the page (probably many times) and use a bit of Javascript to load an XML file into a created XML DOM, extract the pictures from the XML tree and shove them into the COM objects.
Frankly its hardly worth it.
However, you think it is a problem. That implies something special about your pages. Are all these images little spacers or similar?
No comment has been added lately, so it's time to clean up this TA.
I will leave a recommendation in the Cleanup topic area that this question is:
points to avner
Please leave any comments here within the next seven days.
PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!
ahosang
EE Cleanup Volunteer
I will leave a recommendation in the Cleanup topic area that this question is:
points to avner
Please leave any comments here within the next seven days.
PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!
ahosang
EE Cleanup Volunteer
Finalized as proposed
modulo
Community Support Moderator
Experts Exchange
modulo
Community Support Moderator
Experts Exchange