2013年12月3日 星期二

open-flash-chart 儲存圖片


使用前要先引用 Jquery
OpenFlashChart.dll
一、webconfig 加入
 <add assembly="OpenFlashChart"  namespace="OpenFlashChart" tagPrefix="ofc"/>
二、bin 加入  OpenFlashChart.dll
---------------------------------------------------------------------- 
save image locally >> 這個一開始是沒作用的。要自己寫javascript 。













java script
   //寫了這save_image() 方法 'save image locally '按鈕就會有反應了。    function save_image() {
           //ofc 的 id                    另一個用來下載圖片的地方。        $("#ofc")[0].post_image("UCchartpic.ashx?chart=ofc"""true);
    }

html :
<ofc:OpenFlashChartControl runat="server" ID="ofc" Width="500" Height="500" DataFile="emptydata.txt"></ofc:OpenFlashChartControl>



UCchartpic.ashx
 //用途一   直接存到你要的地方
context.Request.SaveAs(context.Server.MapPath("chart.jpg").ToString(), false); 
 //用途二   圖形stream  ,之後可以放進excel
  System.Drawing.Image img = System.Drawing.Image.FromStream(context.Request.InputStream);   System.IO.MemoryStream ms = new System.IO.MemoryStream();   img.Save(ms, System.Drawing.Imaging.ImageFormat.Png);   ms.WriteTo(context.Response.OutputStream);
 //用途三   給使用者下載
    context.Response.AddHeader("Content-Disposition""attachment;filename=chart.jpg");     context.Response.ContentType = "application/octet-stream";     context.Response.OutputStream.Flush();     context.Response.OutputStream.Close();     context.Response.Flush();     context.Response.End();


假設要放進excel
 //將圖片輸出成base64,之後再放進 textbox 裡面最後再從 程式碼讀出來了。
function post_image() {
    var base64Data = $("#ofc")[0].get_img_binary();
   $("#txtimgbase64").attr("value""data:image/png;base64," + base64Data);
   if (base64Data != "") { return true; } else { return false; }
    }
<asp:TextBox ID="txtimgbase64" runat="server" Style="displaynone;"></asp:TextBox>



//把base64 轉成 byte[] 再轉成 MemoryStream 之後就可以放進 Excel拉
byte[] bytes =   Convert.FromBase64String(txtimgbase64.Text.Replace("data:image/png;base64,"""));       using (MemoryStream ofcpic = new MemoryStream(bytes))         {  int picindex = workbook.AddPicture(ofcpic.ToArray(), PictureType.PNG);   }




沒有留言:

張貼留言