Solved

JavaScript, Base64 image decoding and display

Posted on 2007-04-05
4
4,920 Views
Last Modified: 2008-01-09
I would like to use JavaScript to decode a base64 encoded string and display it as a image in a browser, is that possible with JavaScript?
0
Comment
Question by:gzjimfan
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 15

Expert Comment

by:bpmurray
ID: 18860996
Yes.

You're very vague, so it's difficult to be more specific. I'll assume that you can send the Base64 data to the client, so you can do something like:

      var Picture = document.createElement('img');
       Picture.src = 'data:image/gif;base64,' + myBase64Data;

Then you insert this where you want it.
0
 

Author Comment

by:gzjimfan
ID: 18861294
OK, let me explain my question again.

The server encodes the bitmap into base64 string, send to the client through a XML document, the client decodes it in JavaScript and needs to display the bitmap image in the browser. Therefore I guess I will need instructions on the client side to:

(1) do base64 decoding to a binary object
(2) display image in the browser
0
 
LVL 15

Accepted Solution

by:
bpmurray earned 125 total points
ID: 18861736
I don't have a lot of time right now, but try something like:

<html><head>
<script type="text/javascript">
   function showThePicture(myBase64Data) {
      var picture = document.createElement('img');
      picture.src = 'data:image/gif;base64,' + myBase64Data;
      var div = document.getElementById("mydiv");
      div.appendChild(Picture);
      return true;
   }
</script>
</head><body>
<div id="mydiv" style="width:20%; height:20%;background-color: red;"></div>
<input type="button" value="Pic" onclick="return showThePicture('R0lGODlhDQAOAJEAANno6wBmZgAAAAAAACH5BAAAAAAALAAAAAANAA4AQAIjjI8Iyw3GhACSQecutsFV3nzgNi7SVEbo06lZa66LRib2UQAAOw%3D%3D');">
</body></html>
0
 

Expert Comment

by:SpinxInc
ID: 24672810
Hey,
its not working properly,
you have to do something...

thanks,
0

Featured Post

Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

630 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question