ASP.NET MVC Return image dynamically drawn in controller

If you have problem returning dynamically drawn image from controller below informations may help. The task looks easy and should be achieved with this code:

public ActionResult Image(string text)
{
    //Create new image
    Image img = new Bitmap(100, 50);
    Graphics g = Graphics.FromImage(img);
            
    //Do some drawing
    Font font = new Font("Arial", 24);
    PointF drawingPoint = new PointF(10, 10);
            
    g.DrawString(text, font, Brushes.Black, drawingPoint);

    //Return Image
    MemoryStream ms = new MemoryStream();
    img.Save(ms, ImageFormat.Png);

    return new FileStreamResult(ms, "image/png");
}

Unfortunately this won’t work. At least not in .NET 4.0. Perceptive person will notice that after writing image to the stream it position property isn’t at the beginning and FileStreamResult apparently can’t deal with this.

After reseting stream position everything works well (bold line).

using System.Drawing;
using System.Drawing.Imaging;
using System.IO;

...

public ActionResult Hello(string text)
{
    //Create new image
    Image img = new Bitmap(100, 50);
    Graphics g = Graphics.FromImage(img);
            
    //Do some drawing
    Font font = new Font("Arial", 24);
    PointF drawingPoint = new PointF(10, 10);
            
    g.DrawString(text, font, Brushes.Black, drawingPoint);

    //Return Image
    MemoryStream ms = new MemoryStream();
    img.Save(ms, ImageFormat.Png);

    ms.Position = 0;

    return new FileStreamResult(ms, "image/png");
}

Additionally the view which asynchronously (but without ajax) retrieve image from our controller:

<div id="divResult"></div>

<input type="text" id="txtText" value="Hello" />

<input type="button" name="submit" onclick="javascript:Hello();" value="Draw" />

<script type="text/javascript">

function Hello()
{
    var link = '@Url.Content("~/Controller/Hello")';

    var txt = document.getElementById('txtText').value;

    link += '?';
    link += 'text=' + txt;

    document.getElementById('divResult').innerHTML = '<img src="' + link + '" alt="' + txt+ '" />';

    return false;
}

</script>

or you can you an action like:

<img src="@Url.Action("Hello", new { text = "Hello guys!" })" 
       alt="Image for Hello guys!" style="width: 250px;" />

Happy coding!