Question

I would like to write an application that would allow a web user to upload a jpg and position transparent pngs on top of that uploaded image. The number of layers, positioning of the layers, and that actual image file information will be collected and manipulated using javascript and CSS.

After I have the image files and the x-y-z coordinates for the transparent pngs, how can I create a single jpg from these images? Do you guys have a good starting point that I can go to for research?

Edit

Hey there,
The first two answers I got both seem to do the job. What are the differences between using System.Drawing.Graphics and using System.Drawing.Image???

Answer 1

Here’s some code i use (modified to show the principle):

private void ProcessPhoto()
        {


            System.Drawing.Image imgThumb = System.Drawing.Image.FromFile("some.jpg");

            // 43w, 35h = offset in frame

            System.Drawing.Image imgFrame = System.Drawing.Image.FromFile("transparent_something.png");

            Bitmap bmImage = new Bitmap(imgThumb);
            bmImage.SetResolution(72, 72);
            Graphics gFrame = Graphics.FromImage(imgFrame);
            gFrame.DrawImage(bmImage, new Point(38, 44)); // offset point of where you want to draw

            gFrame.Dispose();

            SavePhoto(imgFrame, "dest.png");

            imgFrame.Dispose();           
            imgThumb.Dispose();

        }

        private void SavePhoto(System.Drawing.Image img, string fileName)
        {
            string ext = Path.GetExtension(fileName);
            fileName = fileName.Replace(ext, ".png");            

            img.Save(fileName, GetImageEncoder("PNG"), null);
        }

Edit:
Read all about the Graphics class here