c# Chart 服務器端動態建立ChartArea

1 aspx

  <x:ContentPanel ShowBorder="true" ShowHeader="false" ID="ContentPanel1" runat="server"  >
                        <asp:Chart ID="ChartData" runat="server" Width="1600px" Height="600px"   >
                        </asp:Chart>
            </x:ContentPanel>

2 aspx.cs

        private void LoadSeriesBySearch()
        {
            List<Model.Devices> list = new List<Model.Devices>();
            if (ddlDevice.SelectedItem != null)
            {
                string[] devIds = ddlDevice.SelectedValueArray;
                list = new BLL.Devices().GetModelList(string.Format(" ID IN ({0}) ", string.Join(",", devIds)));
            }
            else
            {
                list = GetDevicesByUserID(CurrentUser.ID); 
            }

            ChartData.Series.Clear();
            ChartData.ChartAreas.Clear();
            ChartData.Titles.Add("設備數據統計");
            ChartArea area = new ChartArea();
            #region 初始化area
            area.BackGradientStyle = GradientStyle.DiagonalLeft;
            area.AxisX.Title = "時間";
            area.AxisY.Title = "壓力值";
            area.AxisX.MajorGrid.LineWidth = 1;
            area.AxisY.MajorGrid.LineWidth = 1;
            area.AxisX.LabelStyle.Font = new Font(FontFamily.GenericSansSerif, 8);
            area.AxisX.MajorGrid.LineDashStyle = ChartDashStyle.Dash;
            area.AxisY.MajorGrid.LineColor = Color.LightSlateGray;
            area.AxisY.MajorGrid.LineDashStyle = ChartDashStyle.Dash;
            ChartData.ChartAreas.Add(area); 
            #endregion
            Color[] cols = { Color.Black, Color.Blue, Color.Brown, Color.Coral, Color.Cyan, Color.Gold, Color.Gray, Color.Green, Color.Lime, Color.Navy };
            int i = 0;
            foreach (Model.Devices dev in list)
            {
                //建立序列
                Series ser = new Series(dev.Name, 1);
                #region 初始化Series
                ser.Name = dev.Name;
                ser.ChartArea = area.Name;
                ser.ChartType = SeriesChartType.Line;
                ser.XValueMember = "RecordDate";
                ser.YValueMembers = "Pressure";
                ser.MarkerBorderColor = Color.BlueViolet;
                ser.MarkerBorderWidth = 3;
                ser.MarkerColor = Color.Red;
                ser.MarkerSize = 5;
                ser.MarkerStyle = MarkerStyle.Diamond;
                ser.LabelForeColor = Color.Black;
                #region 設置序列的顏色
                if (i == 10)
                {
                    i = 0;
                }
                ser.Color = cols[i];
                i++; 
                #endregion
                ser.ShadowColor = Color.Yellow;
                ser.ToolTip = "Pressure:#VAL\r\nTime:#VALX";
                ser.SmartLabelStyle.Enabled = false;
                ser.BorderWidth = 3;
                ser.ShadowOffset=2;
                ser.IsVisibleInLegend = true;
                ser.IsValueShownAsLabel = true;
                ser.IsXValueIndexed = false;
                //ser.Legend = dev.Name;
                Legend leg = new Legend();
                leg.Name = dev.Name;
                leg.BackColor = Color.Transparent;
                leg.Docking = Docking.Right;
                leg.Font = new Font(FontFamily.GenericSansSerif, 20);
                leg.Alignment = StringAlignment.Near;
                //leg.Position = new ElementPosition(-100,0,20,20);
                ChartData.Legends.Add(leg);
                #endregion
                //建立點
                List<Model.DeviceDatas> dds = new List<Model.DeviceDatas>();
                if ((dpStartDate.SelectedDate != null) && (dpEndDate.SelectedDate != null))
                {
                    dds = new BLL.DeviceDatas().GetModelList(string.Format(" DEVICEID={0} AND RECORDDATE BETWEEN '{1}' AND '{2}' ", dev.ID, dpStartDate.SelectedDate, dpEndDate.SelectedDate));
                }
                else
                {
                    dds = new BLL.DeviceDatas().GetModelList(string.Format(" DEVICEID={0} ", dev.ID));
                }
                foreach (Model.DeviceDatas dd in dds)
                {
                    ser.Points.AddXY(dd.RecordDate, dd.Pressure);
                }
                ChartData.Series.Add(ser);
            }
        }

        //得到當前用戶的設備集合
        private List<Model.Devices> GetDevicesByUserID(int p)
        {
            List<Model.Devices> list = new List<Model.Devices>();
            if (CurrentUser.IsSysUser == true)
            {
                list = new BLL.Devices().GetListTop("", 8);
            }
            else
            {
                //若是存在客戶、不存在項目，查詢該客戶下的全部設備數據
                if (CheckForeignIDIsExist(CurrentUser.CustomerID) && !CheckForeignIDIsExist(CurrentUser.ProjectID))
                {
                    list = new BLL.Devices().GetDevicesListByCustomerID((int)CurrentUser.CustomerID, "", "", 1, 8);
                }
                //若是存在客戶、存在項目、不存在站點，查詢該項目下的設備數據
                else if (CheckForeignIDIsExist(CurrentUser.CustomerID) && CheckForeignIDIsExist(CurrentUser.ProjectID) && !CheckForeignIDIsExist(CurrentUser.SiteID))
                {
                    list = new BLL.Devices().GetDevicesListByProjectID((int)CurrentUser.CustomerID, "", "", 1, 8);
                }
                //若是存在客戶、項目、站點，查詢該站點下的設備數據
                else if (CheckForeignIDIsExist(CurrentUser.CustomerID) && CheckForeignIDIsExist(CurrentUser.ProjectID) && CheckForeignIDIsExist(CurrentUser.SiteID))
                {
                    list = new BLL.Devices().GetListTop(string.Format(" SiteID={0} ", CurrentUser.SiteID),8);
                }
            }
            return list;
        }

View Code

 

3 error:

FineUI的控件

<x:Button runat="server" ID="btnSearch" Text="搜索" Icon="SystemSearch" OnClick="btnSearch_Click" />

能夠進入服務器執行，可是server執行以後，並無異步更新到client。

在FineUI中須要設置其異步區域：

 AjaxAspnetControls="ChartData" 

<x:PageManager ID="PageManager1" AutoSizePanelID="Panel1"  AjaxAspnetControls="ChartData" runat="server" />

 

4 更進一步，應該寫jquery進行異步更新，在server中藉助第三方chart庫動態建立一個曲線圖（或者本身畫一個Bitmap曲線圖），而後返回給client的某個區域div。