Hi
I wrote little code to do this job. I post it here.
Pooya
Server Side Code:
private void GenerateChart()
{
string[] source = Request.Form["s"].Split(',');
Image[] ImageSource= new Image[source.Length];
for (int ipos = 0; ipos < source.Length; ipos++)
{
ImageSource[ipos] = Base64ToImage(source[ipos]);
}
int OutputHeight=0;
int OutputWidth=ImageSource[0].Width;
for (int ipos = 0; ipos < source.Length; ipos++)
{
OutputHeight += ImageSource[ipos].Height;
}
var target = new Bitmap(OutputWidth, OutputHeight, PixelFormat.Format32bppArgb);
var graphics = Graphics.FromImage(target);
int Top = 0;
for (int ipos = 0; ipos < source.Length; ipos++)
{
graphics.DrawImage(ImageSource[ipos], 0, Top);
Top += ImageSource[ipos].Height;
}
Response.ClearHeaders();
string base64;
MemoryStream memory =new MemoryStream();
target.Save(memory, ImageFormat.Png);
base64 = Convert.ToBase64String(memory.ToArray());
memory.Close();
memory = null;
Response.Write(base64);
}
private Image Base64ToImage(string base64String)
{
// Convert Base64 String to byte[]
byte[] imageBytes = Convert.FromBase64String(base64String);
MemoryStream ms = new MemoryStream(imageBytes, 0,
imageBytes.Length);
// Convert byte[] to Image
ms.Write(imageBytes, 0, imageBytes.Length);
Image image = Image.FromStream(ms, true);
return image;
}
Client Side Code:
function ExportToImage(ParentDiv) {
var base64="";
var charts=$(ParentDiv + " canvas");
var no=charts.length;
var ipos;
for (ipos = 0; ipos < no; ipos++) {
alert(charts[ipos].toDataURL("image/png").split(',')[0]);
base64 += charts[ipos].toDataURL("image/png").split(',')[1];
if (ipos < no - 1) base64 += ",";
}
$.ajax({
url: "tsev2/chart/img/merge.aspx",
type: "POST",
cache: false,
dataType: "text",
data: { s: base64 },
success: function (data) {
var Result='data:image/png;base64,' + data;
// Use Result in your code
}
});
}