asp.net - 如何使用 ASP.NET Chart 控件制作二维条形图

Question

我正在使用 ASP.NET 图表控件，并希望创建一个 2D 条形图，如下例所示：

我的数据如下所示：

产品 A、产品 B、产品 C 将是页面名称（请参阅我的数据），彩色条将是设备类型。谁能告诉我我该怎么做？

Answer 1

假设您有图表控件……包括所有 dll 和库。您首先需要...：

将图表添加到 ASP.NET 页面

<asp:Chart ID="Chart1" runat="server"> 
   <series> 
      <asp:Series Name="Series1"> 
      </asp:Series> 
   </series> 
   <chartareas> 
      <asp:ChartArea Name="ChartArea1"> 
      </asp:ChartArea> 
   </chartareas> 
</asp:Chart>

您只需将图表控件从工具箱拖到页面上即可。

当通过客户端浏览器访问时，图表控件呈现一个 ChartHttpHandler - 处理请求。

接下来您需要指定图表数据。包括X轴和Y轴——X表示值的位置——Y值表示行的位置或列的高度。

然后，您需要使用 DataBindTable 将数据库数据绑定到图表...。

Using myConnection As New SqlConnection 
   myConnection.ConnectionString = ConfigurationManager.ConnectionStrings("NorthwindConnectionString").ConnectionString 

   Dim myCommand As New SqlCommand 
   myCommand.Connection = myConnection 
   myCommand.CommandText = "SELECT CategoryName, COUNT(*) as ProductCount FROM Products p INNER JOIN Categories c ON c.CategoryID = p.CategoryID GROUP BY CategoryName ORDER BY CategoryName" 

   myConnection.Open() 
   Dim myReader As SqlDataReader = myCommand.ExecuteReader() 

   chtCategoriesProductCount.DataBindTable(myReader, "CategoryName")

   myReader.Close() 
   myConnection.Close() 
End Using 

这将在图表控件中创建一个新系列，因此您无需在标记语言中专门定义一个系列。

获取数据的另一种方法是通过 DataSource 属性...如下。这需要明确定义图表的系列。您还需要指定是折线图还是条形图。

第一部分看起来像：

<asp:Chart ID="chtCategoriesProductCountBarChart" runat="server"> 
   <Titles> 
      <asp:Title Text="Number of Products in Categories"></asp:Title> 
   </Titles> 

   <Series> 
      <asp:Series Name="Categories" ChartType="Line" ChartArea="MainChartArea" BorderWidth="5" Color="Red"></asp:Series> 
   </Series>

   <ChartAreas> 
      <asp:ChartArea Name="MainChartArea"> 
      </asp:ChartArea> 
   </ChartAreas> 
</asp:Chart>

绑定代码：

chtCategoriesProductCountBarChart.Series("Categories").XValueMember = "CategoryName" 
chtCategoriesProductCountBarChart.Series("Categories").YValueMembers = "ProductCount" 

chtCategoriesProductCountBarChart.DataSource = myReader 
chtCategoriesProductCountBarChart.DataBind() 

我假设您知道将这些数据放在哪里，作为图表控制器。祝你好运...

哦，这是我的资源……那里也应该有很多其他的帮助……干杯

http://www.4guysfromrolla.com/articles/072209-1.aspx