asp.net中的圖表控制中的繪製條和折線圖

<asp:Chart ID="chartSellThru" runat="server" Height="400px" Width="1200px" > 
    <Series>      
     <asp:Series Name="ActualsQTD"> 
     </asp:Series> 
     <asp:Series Name="ForecastQTD"> 
     </asp:Series> 
     <asp:Series Name="QTDRatio" ChartType="Line"> 
     </asp:Series> 
     <asp:Series Name="TargetAttain" ChartType="Line"> 
     </asp:Series> 
    </Series> 
    <ChartAreas> 
     <asp:ChartArea Name="SellThruChartArea"> 
     </asp:ChartArea> 
    </ChartAreas> 

chartSellThru.Series["ActualsQTD"].XValueMember = "ProductGroup"; 
chartSellThru.Series["ActualsQTD"].YValueMembers = "ActualsQTD";

我已經在default.aspx頁面中編寫了上面幾行代碼，最後兩行代碼是在default.aspx.cs頁面中編寫的。數據綁定到圖表。asp.net中的圖表控制中的繪製條和折線圖

如何編寫折線圖的代碼。確保值從database.how綁定從sql server到折線圖的值。

來源

2013-02-14 shankar.parshimoni

我想你需要兩個系列應結合圖表如果所以我把下面的代碼

在aspx頁面

<asp:Chart ID="ChartDemo" runat="server" Height="400px" Width="1200px"> 
       <Series> 
        <asp:Series Name="ActualsQTD"> 
        </asp:Series> 
        <asp:Series Name="ForecastQTD"> 
        </asp:Series> 
        <asp:Series Name="QTDAttainMent"> 
        </asp:Series> 
        <asp:Series Name="QTDRatio"> 
        </asp:Series> 
       </Series> 
       <ChartAreas> 
        <asp:ChartArea Name="SellThruChartArea"> 
        </asp:ChartArea> 
       </ChartAreas> 
      </asp:Chart>

，並在aspx.cs頁面

 DataSet ds = new DataSet(); 
     ds = SrcObj.GetSellThruChartData(ddlFiscalMonth.SelectedValue.ToString(), ddlReportWeek.SelectedValue.ToString(), ddlArea.SelectedValue.ToString()); 
     //Column Chart 
     ChartDemo.Series["ActualsQTD"].ChartType = SeriesChartType.Column; 
     ChartDemo.Series["ActualsQTD"]["PointWidth"] = "0.9";    
     ChartDemo.Series["ActualsQTD"]["BarLabelStyle"] = "Center"; 
     ChartDemo.Series["ActualsQTD"]["PixelPointDepth"] = "99"; 
     ChartDemo.Series["ActualsQTD"]["DrawingStyle"] = "Cylinder"; 
     ChartDemo.Series["ForecastQTD"].ChartType = SeriesChartType.Column; 
     ChartDemo.Series["ForecastQTD"]["PointWidth"] = "0.9";    
     ChartDemo.Series["ForecastQTD"]["BarLabelStyle"] = "Center"; 
     ChartDemo.Series["ForecastQTD"]["PixelPointDepth"] = "99"; 
     ChartDemo.Series["ForecastQTD"]["DrawingStyle"] = "Cylinder"; 
     ChartDemo.ChartAreas["SellThruChartArea"].AxisX.Interval = 1;    
     ChartDemo.ChartAreas["SellThruChartArea"].AxisX.MajorGrid.Enabled = false; 
     //ChartDemo.ChartAreas["SellThruChartArea"].AxisY.MajorGrid.Enabled = false; 

     ChartDemo.Series["ActualsQTD"].XValueMember = "ProductGroup"; 
     ChartDemo.Series["ActualsQTD"].YValueMembers = "ActualsQTD";    
     ChartDemo.Series["ForecastQTD"].XValueMember = ""; 
     ChartDemo.Series["ForecastQTD"].YValueMembers = "ForecastQTD"; 
     ChartDemo.Series["ActualsQTD"].IsValueShownAsLabel = true;    
     ChartDemo.Series["ForecastQTD"].IsValueShownAsLabel = true; 

     //Line Chart 
     ChartDemo.Series["QTDAttainMent"].ChartType = SeriesChartType.Line; 
     ChartDemo.Series["QTDRatio"].ChartType = SeriesChartType.Line;   

     ChartDemo.Series["QTDAttainMent"].XValueMember = ""; 
     ChartDemo.Series["QTDAttainMent"].YValueMembers = "QTDAttainMent"; 
     ChartDemo.Series["QTDRatio"].XValueMember = ""; 
     ChartDemo.Series["QTDRatio"].YValueMembers = "QTDRatio"; 

     ChartDemo.Series["QTDAttainMent"].IsValueShownAsLabel = true; 
     ChartDemo.Series["QTDRatio"].IsValueShownAsLabel = true; 

     ChartDemo.Series["QTDAttainMent"].BorderWidth = 3; 
     ChartDemo.Series["QTDAttainMent"].Color = Color.Green; 
     ChartDemo.Series["QTDRatio"].BorderWidth = 3; 
     ChartDemo.Series["QTDRatio"].Color = Color.Red; 

     ChartDemo.Series["QTDAttainMent"].YAxisType = AxisType.Secondary; 
     ChartDemo.Series["QTDRatio"].YAxisType= AxisType.Secondary;   

     ChartDemo.DataSource = ds; 
     ChartDemo.DataBind();

來源

2013-02-15 09:51:35

的代碼非常簡單：

using (SqlConnection conn = new SqlConnection("OMG look a connection string")) 
{ 
    using (SqlCommand cmd = new SqlCommand("SELECT xValue, yValue FROM chartPoints")) 
    { 
     try 
     { 
      conn.Open() 

      using (SqlDataReader rdr = cmd.ExecuteReader()) 
      { 
       chartSellThru.Series["QTDRatio"].Points.DataBindXY(rdr, "xValue", rdr, "yValue"); 
      } 
     } 
     catch(Exception ex) 
     { 
      //handle errors 
     } 
    } 
}

您也可以爲SqlDataSource設置該命令爲SelectCommand和綁定，爲圖表，然後選擇用同樣的方式XValueMember和YValueMembers爲點你之前已經做了：

<asp:SqlDataSource runat="server" ID="dsLinePoints" ConnectionString="OMG look a connection string" SelectCommand="SELECT xValue, yValue FROM chartPoints" /> 

<asp:Chart ID="chartSellThru" runat="server" Height="400px" Width="1200px" DataSourceID="dsLinePoints"> 
    <Series>      
     <asp:Series Name="ActualsQTD"> 
     </asp:Series> 
     <asp:Series Name="ForecastQTD"> 
     </asp:Series> 
     <asp:Series Name="QTDRatio" ChartType="Line"> 
     </asp:Series> 
     <asp:Series Name="TargetAttain" ChartType="Line"> 
     </asp:Series> 
    </Series> 
    <ChartAreas> 
     <asp:ChartArea Name="SellThruChartArea"> 
     </asp:ChartArea> 
    </ChartAreas> 
</asp:Chart> 

chartSellThru.Series["QTDRatio"].XValueMember = "xValue"; 
chartSellThru.Series["QTDRatio"].YValueMembers = "yValue";

來源

2013-02-14 12:40:55 Sean

你可以做到這一點簡單先，然後去多個系列。

網頁代碼背後：

Values[]={10,20,30,40,50} 

weekworkline1.Series.Add(new AjaxControlToolkit.LineChartSeries { Data = values, LineColor = "#2fd1f9", Name = "Working Hours" });

.aspx的代碼：

<asp:LineChart ID="weekworkline1" runat="server" ChartHeight="300" ChartWidth="900" ChartType="Stacked"></asp:LineChart>

來源

2013-10-04 13:47:40 saylesh

asp.net中的圖表控制中的繪製條和折線圖

回答

相關問題