如何使用ASP.NET图表控件2D条形图

Question

我使用的是ASP.NET图表控件，想要创建一个像这个例子的二维条形图：

我的数据如下：

产品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将数据库数据绑定到Chart ...

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