【TeeChart .NET教程】（十）Web表單示例

【下載TeeChart.Net最新版本】

Web表單示例

如何創建動態WebChart

• 在服務器上創建一個新的WebForm應用程序，并確保它在表單上沒有任何內容正確運行。
• 從Steema ToolBox選項卡中，選擇一個WebChart對象并將其拖動到WebForm上。
• 選擇新的WebChart1對象，然后在“Properties ”窗口中導航到TempChart屬性并將其從“File ”更改為“Session”。這意味著WebChart生成的所有臨時圖表都將存儲在會話變量中，而不是存儲在臨時文件夾中。
• 為了從會話變量中恢復臨時圖表，添加一個新的表單，其中包含一些簡單的代碼。右鍵單擊ASP.NET項目并添加一個新的WebForm，命名為GetChart.aspx。現在確保Page_Load事件如下所示：

  private void Page_Load(object sender, System.EventArgs e) 
  { 
       string chartName=Request.QueryString["Chart"];               
       if (Session[chartName]!=null)              
      {                  
          System.IO.MemoryStream chartStream = new System.IO.MemoryStream();              
          chartStream=((System.IO.MemoryStream)Session[chartName];                  
          Response.OutputStream.Write(chartStream.ToArray(),0,(int)chartStream.Length);                  
          chartStream.Close();                  
          Session.Remove(chartName);              
      }  
  } 

• 繼續生成一些基本的HotSpot功能; 在原始WebForm的Form_Load事件中，可以添加類似于以下內容的代碼：

  	private void Page_Load(object sender, System.EventArgs e) 
  { 
       //Let's work with the Chart object for convenience 
       Steema.TeeChart.Chart Chart1 = WebChart1.Chart; 
   
       //Add in a series and fill it 
       Chart1.Aspect.View3D = false; 
       Steema.TeeChart.Styles.Bubble bubble1 = new Steema.TeeChart.Styles.Bubble(Chart1); 
       bubble1.FillSampleValues(); 
   
       //Add a SeriesToolTip to the Chart 
       Steema.TeeChart.Tools.SeriesHotspot seriesHotSpot1 = new Steema.TeeChart.Tools.SeriesHotspot(Chart1); 
       //Steema.TeeChart.Styles.MapAction.Mark is the default value 
       seriesHotSpot1.MapAction = Steema.TeeChart.Styles.MapAction.Mark; 
  } 
  	

• 要向圖表添加縮放功能，我們需要做的就是添加一個zoomtool和一些簡單的代碼來控制縮放狀態：

  		private void Page_Load(object sender, System.EventArgs e) 
  { 
       //Let's work with the Chart object for convenience 
       Steema.TeeChart.Chart Chart1 = WebChart1.Chart; 
   
       //Add in a series and fill it 
       Chart1.Aspect.View3D = false; 
       Steema.TeeChart.Styles.Bubble bubble1 = new Steema.TeeChart.Styles.Bubble(Chart1); 
       bubble1.FillSampleValues(); 
   
       //Add a SeriesToolTip to the Chart 
       Steema.TeeChart.Tools.SeriesHotspot seriesHotSpot1 = new Steema.TeeChart.Tools.SeriesHotspot(Chart1); 
       //Steema.TeeChart.Styles.MapAction.Mark is the default value 
       seriesHotSpot1.MapAction = Steema.TeeChart.Styles.MapAction.Mark; 
   
       //Add a ZoomTool to the Chart 
       Steema.TeeChart.Tools.ZoomTool zoomTool1 = new Steema.TeeChart.Tools.ZoomTool(Chart1); 
   
       // *************** Code for zoom support *************** 
       //check whether zoom request is being sent 
       CheckZoom(WebChart1); 
  } 
   
  private void CheckZoom(WebChart wChart) 
  { 
       ArrayList zoomedState=(ArrayList)Session[wChart.ID+"Zoomed"]; 
       zoomedState=((Steema.TeeChart.Tools.ZoomTool)wChart.Chart.Tools[0]).SetCurrentZoom(Request,zoomedState); 
       if (zoomedState==null) 
          Session.Remove(wChart.ID+"Zoomed"); 
       else 
          Session.Add(wChart.ID+"Zoomed",zoomedState); 
  } 
  		

• 有一個交互式圖表，可響應鼠標懸停和鼠標點擊事件。SeriesHotSpot（在這種情況下與氣泡系列相關聯）將在鼠標移過它時顯示系列標記的值。但是，通過MapAction屬性，我們可以在鼠標移過它時自定義SeriesHotSpot的行為。例如，我們可能希望點擊其中一個氣泡將我們帶到指定的URL; 通過將MapAction屬性設置為URL，鏈接SeriesHotSpot事件并在其中指定URL，在Page_Load事件中：

  	seriesHotSpot1.MapAction = Steema.TeeChart.Styles.MapAction.URL; 
  	seriesHotSpot1.GetHTMLMap += new Steema.TeeChart.Tools.SeriesHotspotEventHandler(seriesHotSpot1_GetHTMLMap); 
  	

• GetHTMLMap方法：

  	private void seriesHotSpot1_GetHTMLMap(Steema.TeeChart.Tools.SeriesHotspot sender, Steema.TeeChart.Tools.SeriesHotspotEventArgs e)  
  { 
       e.PointPolygon.Title = "Go to the Steema web"; 
       e.PointPolygon.HREF = "//www.steema.com"; 
       e.PointPolygon.Attributes = "target='_blank'"; 
  } 
  	

• 有效地將MapAction屬性設置為Script允許用戶定義任何事件，TeeChart為用戶提供了一些有用的內置腳本，可以通過HelperScripts枚舉來調用。例如，要在鼠標懸停在其中一個氣泡序列點上時打開圖像文件，我們將添加以下代碼，在Page_Load事件中：

  	seriesHotSpot1.MapAction = Steema.TeeChart.Styles.MapAction.Script; 
  	seriesHotSpot1.HelperScript = Steema.TeeChart.Tools.HotspotHelperScripts.Annotation;
  	

• 這里的第二行確保將相關的JavaScript添加到客戶端瀏覽器中，GetHTMLMap方法：

  	private void seriesHotSpot1_GetHTMLMap(Steema.TeeChart.Tools.SeriesHotspot sender, Steema.TeeChart.Tools.SeriesHotspotEventArgs e)  
  { 
       e.PointPolygon.Attributes=String.Format(Steema.TeeChart.Texts.HelperScriptAnnotation, ""); 
  }
  

進一步自定義行為意味著設計自定義的JavaScript例程，將它們添加到客戶端瀏覽器，然后通過將它們及其參數添加到e.PointPolygon.Attributes來調用它們。