When time permits, I like to experiment mixing some old algorithm and new technologies. This time it was up to Mandelbrot fractals generation (an old algorithm) and the WebMatrix (a new application development tool) plus Razor (a new templating engine for ASP.NET web pages). In effect, the Mandelbrot set is a well-known geometric guy, but it never ends to amaze me, especially when it’s time to figure out and try new coloring algorithms. This time it was also the occasion to practice the Razor syntax inside a vanilla WebMatrix project.
The solution
My solution is built around two methods: the Mandelbrot fractal algorithm and a PNG picture generator, that creates a colored image from the fractal data generated by the former algorithm. Both methods are described ahead in this post. The home page Default.cshtml is a simple HTML page, including an <div id=”mandel” /> tag that will host the fractal image.
1 2 3 4 5 6 7 8 9 10 11 12 13 | <!DOCTYPE html> < html lang = "en" > < head > < meta charset = "utf-8" /> < title >Razor Mandelbrot Generator</ title > < script src = '@Href("~/Scripts/jquery-1.4.4.min.js")' type = 'text/javascript' ></ script > </ head > < body > < h1 >Razor Mandelbrot Generator</ h1 > < div id = "mandel" >@H.MandelbrotHtmlImage(w,h,minR,maxR,minI,maxiter)</ div > <!--Zoom box will go here--> </ body > </ html > |
1 2 3 4 | @helper MandelbrotHtmlImage( int w, int h, double minr, double maxr, double mini, int maxiter) { <img alt= "Mandelbrot Fractal" src= "@Href(" ~/Get?w= " + w + " &h= " + h + " &maxiter= " + maxiter + " &minr= " + minr + " &maxr= " + maxr + " &mini= " + mini)" /> } |
Getting the fractal image as a binary stream
The Get.cshtml page does tree things:- Calculating the fractal data
- Building and coloring a PNG image from the fractal data
- Returning the image as a binary stream
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | //The Get.cshtml main fragment: @{ var data = H.GetMandelbrotSet(w,h,minR,maxR,minI,maxiter); var img = new Bitmap(w, h); // The coloring algorithm stuff // ... var ram = new MemoryStream(); img.Save(ram,ImageFormat.Png); ram.Seek(0, SeekOrigin.Begin); H.BinaryResponse(ram, String.Format( "mandel_{0}_{1}_{2}.png" , minR, maxR, minI), "image/png" ); } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | @functions { public static void BinaryResponse(Stream s, string filename, string mimetype) { Response.Clear(); Response.Buffer = true ; Response.AddHeader( "Content-Length" , s.Length.ToString()); Response.AddHeader( "Content-Disposition" , "inline; filename=" + filename.Replace( " " , "_" )); Response.ContentType = mimetype; s.CopyTo(Response.OutputStream); Response.End(); } // other functions… } |
1 2 3 4 5 6 7 8 9 10 11 12 | public static int [][] GetMandelbrotSet( int w, int h, double minr, double maxr, double mini, long maxiter) { var image = new int [w][]; for ( int i = 0; i < w; i++) image[i] = new int [h]; //Boring implementation details about generating a Mandelbrot fractal //... return image; } |
Edit: I finally published the second part of the article .
Stay tuned and happy programming!
No comments:
Post a Comment