如何在aspx图表控件中为柱形图设置动画?

时间:2017-04-04 05:39:12

标签: javascript c# asp.net charts timer

我在单击按钮时使用asp Chart控件显示了柱形图。这是工作。现在我想设置一些计时器,以便在页面加载时使用计时器显示每一列(如动画)。如果不使用任何库,怎么可能?

<asp:Chart ID="Chart1" Visible="false" runat="server" 
    BackColor="DarkRed" BackImageAlignment="Center" 
        BackImageTransparentColor="MediumVioletRed" BackSecondaryColor="White" 
        BorderlineDashStyle="DashDotDot" Palette="Excel" Height="390px" 
        Width="800px">
        <Titles>
    <asp:Title Font="Times New Roman, 12pt, style=Bold" Name="Title1"  ForeColor="White"
        Text="Sample Test">
    </asp:Title>
</Titles>
 <Series>
 <asp:Series Name="Series1" XValueMember="month" YValueMembers="sales"  ChartType="Column"
CustomProperties="DrawingStyle=LightToDark, DrawSideBySide=True" Color="#800033" IsValueShownAsLabel="True"  LabelForeColor="#800033">
</asp:Series> 
    </Series>
  <ChartAreas>
   <asp:ChartArea Name="ChartArea1" BorderColor="Transparent">               
   </asp:ChartArea>
   </ChartAreas>
   </asp:Chart>


    public void BindDatatoChart1()
{
    Chart1.Visible = true;
    DataTable dt = new DataTable();
    using (SqlConnection cn = obj.getcon())
    {
        string sql = "select * from sample1 order by id";
        using (SqlCommand cmd = new SqlCommand(sql, cn))
        {
            using (SqlDataAdapter da = new SqlDataAdapter(cmd))
            {
                da.Fill(dt);
            }

        }
    }
    System.Timers.Timer timer = new System.Timers.Timer();
    timer.Interval = 15;
    timer.Start();
    Chart1.DataSource = dt;
    Chart1.DataBind();
    }

1 个答案:

答案 0 :(得分:0)

这不是一个真正的ASP.NET问题。我认为你应该纯粹从客户端考虑这个问题。您可以使用纯CSS动画完成您想要的任务 - 您也可能需要,因为ASP.NET是服务器端技术,因此不会为您处理动画。 您可以使用css关键帧将列的初始高度设置为0,然后在给定时间内转换为100%。见this Stack Overflow question