How to display .png format image from ajax response?

Question

I am sending ajax response.getOutputStream().write(encoder.pngEncode()) image in bytes, i want to display image at runtime in my jsp from the ajax response is it possible? Can u please anyone can solve this issue.

In Servlet class:

chartImage = chart.createBufferedImage(400, 300);    
     PngEncoder encoder = new PngEncoder(chartImage, false, 0, 9);

     resp.setContentType("image/png"); 
  resp.setHeader("Cache-Control", "no-cache");
  resp.getOutputStream().write(encoder.pngEncode());

---

In JSP:

if (bbyHttpRequest.readyState == 4) 
    { 
        if(bbyHttpRequest.status == 200) 
        { 
     alert("inside ajax call");

     var respone=bbyHttpRequest.responseText;

     alert("respone----------->"+respone);

     //var i = new Image();
     //i.src = respone;

        //document.getElementById("imgChart1").innerHTML = '<%=request.getContextPath() + "/CreateOMSMonitorScreenTest" %>';
       // document.getElementById("imgChart1").value = '<%=request.getContextPath() + "/CreateOMSMonitorScreenTest" %>';
       document.getElementById("imgChart1").value=respone;

        } 
        else 
        {
     alert(' Dynamic call to web server failed.Please refresh the page. ');
        } 
    }

Answer 1

If you have a server that returns PNG images, you don't have to use ajax, you can use simple HTML:

<img src='myServer.thing?param=value' alt='Loading Failed' />

You can use JavaScript to handle errors of the img tag.

Answer 2

There are data urls, so you can create a tag like <img src="data:image/png;base64, iVBORw0KGgo..." />

However, IE6 does not support that, which might or might not be an issue for you.