Home > DeveloperSection > Articles > Dynamically loading image in Image control in ASP.NET

Dynamically loading image in Image control in ASP.NET

ASP.Net ASP.Net 
5 Comment(s)
 76135  View(s)
Rate this:

Dynamically loading image in Image control in ASP.NET

In this demonstration we tell you that how to add images in image control dynamically.

Steps to implement this task

Please follow the following steps to implement desire task

Ø  Add two aspx file in project and give named as like Default.aspx and DynamicImage.aspx.

Ø  Write down following aspx script code to design user interface on Default aspx.

<div style="height: 486px; width: 872px">   

        <asp:Image ID="Image1" runat="server" Height="432px" Width="866px" />

        <br />

        <asp:TextBox ID="TextBox1" runat="server"

            style="margin-left: 26px; margin-top: 17px" Width="183px"></asp:TextBox>


        <asp:Button ID="Button1" runat="server" onclick="Button1_Click"

            style="margin-left: 21px; margin-top: 15px" Text="Enter Image URL"

            Width="136px" />   



Ø  At the click event of Button1 writes down following code.

Image1.ImageUrl = "DynamicImage.aspx?path=" + TextBox1.Text;

Ø  At the load event of DynamicImage.aspx write down the following code
protected void Page_Load(object sender, EventArgs e)


              string path = Request.QueryString[0];

              if (path != null)


                     System.Drawing.Bitmap img = new System.Drawing.Bitmap(path);

              img.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);



Output of the following code

Dynamic add image in image control in asp.net

After clicking Enter Image URL button following output will be displayed

Dynamic add image in image control in asp.net



Dynamic Bitmap

By Emerson Carvalho on   4 years ago
How can I do this with a dynamic bitmap instead a Local File?

Like this:
var myImage = new Bitmap(800,250);

Dynamic Bitmap

By Arun Singh on   4 years ago
Hi Emerson Carvalho,
Could you explain your question in detail actually what are you trying to do?

Dynamic Bitmap

By Emerson Carvalho on   4 years ago

I'm trying to create a image using the System.Drawing.Graphics and display in a control on the page, but I don't know how do this without save the image on the System Files.

I want to set the new image to a specific "
<asp:Image" on the page

Part of my code:

var newImage = new Bitmap(800,250);

System.Drawing.Graphics g = Graphics.FromImage(newImage);
Rectangle Box = new Rectangle(10, 10, newImage.Size.Width - 20, newImage.Size.Height - 20);

g.DrawRectangle(Pens.Black, Box);

//Many other methods to draw

Response.ContentType = 

newImage.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);

Dynamic Bitmap

By Arun Singh on   4 years ago
Hey Emerson Carvalho,
I think you want to assign bitmap image in asp image control directly without saving image file in system. Let me tell you it is not possible to directly set the image in asp image control!! because of unlike System.Windows.Forms.PictureBoxSystem.Web.UI.WebControls.Image  does not have Bitmap property. System.Web.UI.WebControls.Image is Server version of html img tag (Its takes ImageUrl and renders as "<img src='/images/xyz.jpg' />").

To perform this task. Firstly you have to save the bitmap to a file, then assign that file to the Image1.ImageUrl, then load that file. As above article is showing.

Please marked as answer if this post will resolved your problem.

Dynamic Bitmap

By Emerson Carvalho on   4 years ago
Hello Arun Singh,

I solve my problem creating a Handler.ashx.

I call the Handler in the page like this:

asp:Image ID="myImage" ImageUrl="~/ImageHandler.ashx?id=1" runat="server" />
And the handler will return the image without save the file.
<%@ WebHandler Language="C#" Class="ImageHandler" %>
using System;
using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using System.Web;
public class ImageHandler : IHttpHandler
    public void ProcessRequest(HttpContext context)
        if (!String.IsNullOrEmpty(context.Request.QueryString["id"]))
            int id = Int32.Parse(context.Request.QueryString["id"]);
            // Now you have the id, do what you want with it, to get the right image
            // More than likely, just pass it to the method, that builds the image
            Image image = GetImage(id);
            // Of course set this to whatever your format is of the image
            context.Response.ContentType = "image/jpeg";
            // Save the image to the OutputStream
            image.Save(context.Response.OutputStream, ImageFormat.Jpeg);
            context.Response.ContentType = "text/html";
            context.Response.Write("<p>Need a valid id</p>");
    public bool IsReusable
            return false;
    private Image GetImage(int id)
        var newImage = new Bitmap(800, 250);         System.Drawing.Graphics g = Graphics.FromImage(newImage);
g.FillRectangle(Brushes.White, 0, 0, newImage.Width, newImage.Height);
        Rectangle Box = new Rectangle(10, 10, newImage.Size.Width - 20, newImage.Size.Height - 20);         g.DrawRectangle(Pens.Black, Box);

//My drawing code
        return newImage;     } }

Don't want to miss updates? Please click the below button!

Follow MindStick