如何自定义ASP.NET图表数据绑定到SqlDataSource [英] How To Customize ASP.NET Chart Databound To SqlDataSource
问题描述
我有一个这样的ASP图表:
I have an ASP Chart like this:
我不确定如何使值的标签显示为垂直而不是水平.我不确定这是否可以通过CSS实现，因为结果输出是图像.
I am not sure how I can make the labels for the values to appear vertical instead of being horizontal. I am not sure if this can be achieved by CSS as the resultant output is an image.
我所拥有的就是这样的代码: 在这里看到了类似的问题: C#图表旋转标签，但这是针对C#和给定的解决方案具有C#代码.我正在使用ASP.NET VBScript，并且除了上面的标记之外，我没有使用任何其他代码.
All I have with me is the code which says something like this: Saw some similar question here: C# chart rotate labels, but it is for C# and the given solution has C# code. I am using ASP.NET VBScript and also I am not using any code other than the above mark-up.
还请告诉我如何将条形颜色更改为另一种颜色.
Also please advice me how to change the bar colour to a different one.
还有什么我需要检查的吗?
Is there anything else that I should check?
推荐答案
将LabelAngle和Color定义为所需的值，并禁用SmartLabelStyle，如下面的标记所示:
Define LabelAngle and Color to the values you want and disable SmartLabelStyle as shown in the markup below:
<asp:Chart ID="Chart1" runat="server" DataSourceID="SqlDataSource1" Height="400px" Width="600px">
<Series>
<asp:Series Name="Series1" IsValueShownAsLabel="True" LabelAngle="-90" LabelFormat="0,0" XValueMember="salesordernumber" YValueMembers="subtotal" Color="Red" Font="Microsoft Sans Serif, 12pt">
<SmartLabelStyle Enabled="False" />
</asp:Series>
</Series>
<ChartAreas>
<asp:ChartArea Name="ChartArea1">
<AxisY Maximum="3000">
<MajorGrid Enabled="False" />
<LabelStyle Format="0,0" />
</AxisY>
<AxisX>
<MajorGrid Enabled="False" />
</AxisX>
</asp:ChartArea>
</ChartAreas>
</asp:Chart>
编辑:使用图表的PreRender事件为系列中的每个数据点分配不同的颜色.下面的示例分配了随机的颜色，但是您可以对其进行修改以分配所需的任何颜色.
EDIT: use the chart's PreRender event to assign different colors to each data point in your series. The sample below assigns random colors but you could modify it to assign any colors you want.
protected void Chart1_PreRender(object sender, EventArgs e)
{
Random r = new Random();
foreach (DataPoint dp in Chart1.Series[0].Points)
dp.Color = Color.FromArgb(r.Next(0, 255), r.Next(0, 255), r.Next(0, 255));
}
编辑:添加完整的VB代码.
Adding full VB code.
WebForm.aspx:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication1.WebForm1" %>
<%@ Register assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" namespace="System.Web.UI.DataVisualization.Charting" tagprefix="asp" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Chart ID="Chart1" runat="server" Height="400px" Width="600px" DataSourceID="SqlDataSource1">
<Series>
<asp:Series Name="Series1" IsValueShownAsLabel="True" LabelAngle="-90" LabelFormat="0,0" XValueMember="salesordernumber" YValueMembers="subtotal" Color="Red" Font="Microsoft Sans Serif, 12pt">
<SmartLabelStyle Enabled="False" />
</asp:Series>
</Series>
<ChartAreas>
<asp:ChartArea Name="ChartArea1">
<AxisY Maximum="3000">
<MajorGrid Enabled="False" />
<LabelStyle Format="0,0" />
</AxisY>
<AxisX>
<MajorGrid Enabled="False" />
</AxisX>
</asp:ChartArea>
</ChartAreas>
</asp:Chart>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="select * from table;"></asp:SqlDataSource>
</div>
</form>
</body>
</html>
WebForms.aspx.vb:
Imports System.Web.UI.DataVisualization.Charting
Imports System.Drawing
Public Class WebForm1
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
End Sub
Protected Sub Chart1_PreRender(sender As Object, e As EventArgs) Handles Chart1.PreRender
Dim r As New Random
For Each dp As DataPoint In Chart1.Series(0).Points
dp.Color = Color.FromArgb(r.Next(0, 255), r.Next(0, 255), r.Next(0, 255))
Next
End Sub
End Class
这篇关于如何自定义ASP.NET图表数据绑定到SqlDataSource的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
