求教：页面及时更新的柱状图

Question

如何使页面即时更新？setTimeout如何使用，如何优化客户端显示速度等

Answer 1

在google里搜索vml。实现非常简单。代码特好懂。

Answer 2

应该在javascript板块去发这个问题呀,不过.net也可以实现柱状图
http://dotnet.aspx.cc/ShowDetail.aspx?id=221BC601-1A1B-4E1F-883D-04B043659703

Answer 3

我还是喜欢javascript解决这个问题，客户端嘛，很不错的，柱状图的问题已近解决，代码供大家参考谢谢，结贴！
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Drawing.Imaging;namespace PageTest
{
/// <summary>
/// DrawBar 的摘要说明。
/// </summary>
public class DrawBar : System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
DrawBarNow();
} #region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}

/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{    
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion private void DrawBarNow()
{
//创建一个长度为600，宽带为250的Bitmap实例
Bitmap bm = new Bitmap ( 800 , 300 ) ;
 
Graphics g ; 
//由此Bitmap实例创建Graphic实例 
g = Graphics.FromImage ( bm ) ; 
//用Snow色彩为背景色填充此绘画图面 
g.Clear ( Color.Snow ) ; 
//在绘画图面的指定位置，以指定的字体、指定的颜色绘制指定的字符串。即为图表标题 
g.DrawString ( "大赛" , new Font ( "隶书" , 16 ) , Brushes.Black , new Point ( 100 , 5 ) ) ; 
//以下代码是是实现图下部 
//Point myRec = new Point ( 535 , 30 ) ; 
//Point myDec = new Point ( 560 , 26 ) ; 
//以下是在图中为下面绘制定位
Point myRec = new Point ( 50 , 300 ) ; 
Point myDec = new Point ( 15 , 280 ) ; 
//g.DrawString ( "参赛人员" , new Font ( "宋体" , 9 ) , Brushes.Black , new Point ( 50 , 270 ) ) ; 
for ( int i = 0 ; i < CreateDataSource().Table.Rows.Count ; i++ )  
{ 
//绘制小方块，屏蔽显示，高度和宽度都是0
g.DrawRectangle ( Pens.Black , myRec.X , myRec.Y , 0 , 0 ) ; 
//填充小方块，屏蔽显示，高度和宽度都是0
g.FillRectangle ( new SolidBrush ( GetColor ( i ) ) , myRec.X , myRec.Y , 0 , 0 ) ; 
//绘制柱图下方文字
g.DrawString ( CreateDataSource().Table.Rows[i][2].ToString()+"号", new Font ( "宋体" , 9 ) , Brushes.Black , myDec) ; 
//调整块图和文字间距
myRec.X += 40 ; 
myDec.X += 40 ; 
}
//以下代码是绘制图中的Bar图，及其投票数量
int iBarWidth = 40 ; 
int scale = 10 ; 
for ( int i = 0 ; i < CreateDataSource().Table.Rows.Count ; i++ )  
{ 
int realScale = Convert.ToInt32(CreateDataSource().Table.Rows[i][1].ToString()) * scale ;
float realRate = Convert.ToSingle(GetRate(Convert.ToInt32(CreateDataSource().Table.Rows[i][1].ToString()))/100);
//绘制Bar图 
g.DrawRectangle ( Pens.Black , ( i * iBarWidth ) + 15 , 250 - 300*realRate/100 , 20 , 300*realRate/100 + 5 ) ; 
//以指定的色彩填充Bar图
g.FillRectangle ( new SolidBrush ( GetColor ( i ) ) , ( i * iBarWidth ) + 15 , 250 - 300*realRate/100 , 20 , 300*realRate/100 + 5 ) ; 
//显示Bar图代表的数据 
g.DrawString (realRate.ToString()+"%" , new Font ( "宋体" , 9 ) , Brushes.Black , ( i * iBarWidth ) + 15 , 235 - 300*realRate/100 ) ; 
} 
//以下代码是绘制图中的边框，并形成Jpeg文件，供浏览器显示出来 
Pen p = new Pen ( Color.Snow, 1 ) ; 
g.DrawRectangle ( p , 1 , 1 , 798 , 298 ) ; 
this.Response.ClearContent();
this.Response.ContentType = "image/jpeg";
bm.Save ( Response.OutputStream , ImageFormat.Jpeg ) ;  
this.Response.End();
}
//获取个柱体颜色
private Color GetColor ( int itemIndex )  
{ 
　 Color MyColor ; 
　 int i = itemIndex ; 
　 switch (i)  
　 { 
　　 case 0 : 
　　　  MyColor = Color.Cornsilk; 
　　　  return MyColor ; 
　　 case 1 : 
　　　  MyColor = Color.Red; 
　　　  return MyColor ; 
　　 case 2 : 
　　　  MyColor = Color.Yellow; 
　　　  return MyColor ; 
　　 case 3 : 
　　　  MyColor = Color.SeaGreen; 
　　  return MyColor ; 
　 case 4 : 
　 　　 MyColor = Color.Orange; 
　 　　 return MyColor ; 
　 　 case 5 : 
　　　  MyColor = Color.Coral; 
　　　  return MyColor ; 
　　 case 6: 
　　　  MyColor = Color.Gray; 
　　　  return MyColor ; 
　　 case 7: 
　　　  MyColor = Color.Maroon; 
　　  return MyColor ; 
　　 case 8: 
　　  MyColor = Color.Tomato; 
　　　  return MyColor ; 
　　 case 9: 
　　  MyColor = Color.AliceBlue; 
　　  return MyColor ; 
　 　  case 10: 
　　  MyColor = Color.Bisque; 
　　  return MyColor ; 
　　 case 11: 
　　  MyColor = Color.BurlyWood; 
　　  return MyColor ; 
　　 case 12: 
　　　  MyColor = Color.SlateBlue; 
　　  return MyColor ; 
case 13: 
　　　  MyColor = Color.Thistle; 
　　  return MyColor ; 
case 14: 
　　　  MyColor = Color.LightSteelBlue; 
　　  return MyColor ; 
case 15: 
　　　  MyColor = Color.Cyan; 
　　  return MyColor ; 
case 16: 
　　　  MyColor = Color.GreenYellow; 
　　  return MyColor ; 
case 17: 
　　　  MyColor = Color.SpringGreen; 
　　  return MyColor ; 
case 18: 
　　　  MyColor = Color.Turquoise; 
　　  return MyColor ; 
　 default: 
　  　　MyColor = Color.Green; 
　　     return MyColor ; 
　 } 
} public double GetRate(int Num)
{
//初始化一个整数(投票数总和)为零
int CountNum=0;
for(int i=0;i<CreateDataSource().Table.Rows.Count;i++)
{
//循环获取总投票数
CountNum += Convert.ToInt32(CreateDataSource().Table.Rows[i][1].ToString());
}
return System.Math.Floor(Num*10000/CountNum);
}
public DataView CreateDataSource()
{ System.Data.DataTable dt = new System.Data.DataTable();
DataRow dr;
dt.Columns.Add(new DataColumn("id", typeof(Int32)));
dt.Columns.Add(new DataColumn("Num", typeof(Int32)));
dt.Columns.Add(new DataColumn("Name", typeof(String)));
for (int i=0; i<=18; i++) 
{
dr = dt.NewRow();
dr[0] = i+5;
dr[1] = i*2+1;
dr[2] ="N"+(i*2+1);
dt.Rows.Add(dr);
}
 
DataView dv = new DataView(dt);
return dv;
      
}
}
}