今天是:
首 页信息查询网站SEO查询工具CSS编辑器建站素材
网海拾贝,电脑资讯,电脑快报,it资讯,网站建设资讯,教程基地
软件新闻
操作系统
Vista Winxp Win2003 Linux Windows综合
工具软件
系统工具 媒体工具 网络工具 杀毒软件 聊天
软件开发
C教程 C++ Java C# ASP.NET JSP PHP
数据库
Oracle MySQL DB2 SQL Server Sybase
安全
网络 病毒
办公应用
Word Excel Powerpoint Outlook 其他
平面设计
Photoshop Fireworks Coreldraw Flash Illustrator 3dsmax
网站运营
网站运营 网站优化 网站策划 策划书下载 建站心得 站长故事 网站盈利 网页制作 网页特效 建站素材 免费资源 QQ频道
  当前位置:首 页 >> 网页制作 >> Javascript/Ajax >> JavaScript实现 折线图、饼图、柱状图

JavaScript实现 折线图、饼图、柱状图

  发布于2005-10-22 17:13 来源:网海拾贝

  JavaScript函数之折线图 
----------------------------------- 
〈script language=javascript〉 
function table2(total,table_x,table_y,all_width,all_height,line_no) 

var line_color = "#69f";; 
var left_width = 70;; 
var total_no = total[1].length 
var temp1,temp2,temp3 
temp1 = 0;; 
for(var i=1;;i〈total_no;;i++) 

for(var j=1;;j〈=line_no;;j++) 

if(temp1〈total[j][i]) 
temp1 = total[j][i];; 


temp1 = parseInt(temp1);; 
if(temp1〉9) 

temp2 = temp1.toString().substr(1,1);; 
if(temp2〉4) 

temp3 = (parseInt(temp1/(Math.pow(10,(temp1.toString().length-1))))+1)*Math.pow(10,(temp1.toString().length-1));; 

else 

temp3 = (praseInt(temp1/(Math.pow(10,(temp1.toString().length-1))))+0.5)*Math.pow(10,(temp1.toString().length-1)) 


else 

if(temp1〉4) 

emp3 = 10;; 

else 

temp3 = 5;; 


temp4 = temp3;; 
document.write("〈v:rect id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:" + (table_x + left_width) + "px;;top:" + table_y + "px;;width:" + all_width + "px;;height:" + all_height + "px;;z-index:-1’ fillcolor=’#9cf’ stroked=’f’〉〈v:fill rotate=’t’ angle=’-45’ focus=’100%’ type=’gradient’/〉〈/v:rect〉");; 
for(var i=0;;i〈all_height;;i += all_height/5) 

document.write("〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x + left_width + length) + "px," + (table_y + all_height - length - i) + "px’ to=’" + (table_x + all_width + left_width) + "px," + (table_y + all_height - length - i) + "px’ strokecolor=’" + line_color + "’/〉");; 
document.write("〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x + (left_width - 15)) + "px," + (table_y + i) + "px’ to=’" + (table_x + left_width) + "px," + (table_y + i) + "px’/〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + table_x + "px;;top:" + (table_y + i) + "px;;width:" + left_width + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’right’〉" + temp4 + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 
temp4 = temp4 - temp3/5;; 

document.write("〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x + left_width) + "px," + (table_y + all_height) + "px’ to=’" + (table_x + all_width + left_width) + "px," + (table_y + all_height) + "px’/〉");; 
document.write("〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x + left_width) + "px," + table_y + "px’ to=’" + (table_x + left_width) + "px," + (table_y + all_height) + "px’/〉");; 
var tmpStr = "" 
for(i=1;;i〈=line_no;;i++) 

var re = /,/g;; 
tmpStr += ",["" + total[i][0].replace(re,"","") + ""]" 

tmpStr = tmpStr.substr(1,tmpStr.length-1) 
var line_code = eval("new Array(" + tmpStr + ")") 
for(var j=1;;j〈=line_no;;j++) 

for(var i=1;;i〈total_no-1;;i++) 

var x1 = table_x + left_width + all_width * (i - 1)/(total_no-1) 
var y1 = table_y + (temp3 - total[j][i]) * (all_height/temp3) 
var x2 = table_x + left_width + all_width * i/(total_no-1) 
var y2 = table_y + (temp3 - total[j][i+1]) * (all_height/temp3) 

document.write("〈v:line id=’_x0000_s1025’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;z-index:1’ from=’" + x1 + "px," + y1 + "px’ to=’" + x2 + "px," + y2 + "px’ coordsize=’21600,21600’ strokecolor=’" + line_code[j-1][0] + "’ strokeweight=’" + line_code[j-1][1] + "’〉");; 
switch (parseInt(line_code[j-1][2])) 

case 1: 
break;; 
case 2: 
document.write("〈v:stroke dashstyle=’1 1’/〉");; 
break;; 
case 3: 
document.write("〈v:stroke dashstyle=’dash’/〉");; 
break;; 
case 4: 
document.write("〈v:stroke dashstyle=’dashDot’/〉");; 
break;; 
case 5: 
document.write("〈v:stroke dashstyle=’longDash’/〉");; 
break;; 
case 6: 
document.write("〈v:stroke dashstyle=’longDashDot’/〉");; 
break;; 
case 7: 
document.write("〈v:stroke dashstyle=’longDashDotDot’/〉");; 
break;; 


document.write("〈/v:line〉");; 

switch (parseInt(line_code[j-1][3])) 

case 1: 
break;; 
case 2: 
document.write("〈v:rect id=’_x0000_s1027’ style=’position:absolute;;left:" + (x1 - 2) + "px;;top:" + (y1 - 2) + "px;;width:4px;;height:4px;; z-index:2’ fillcolor=’" + line_code[j-1][0] + "’ strokecolor=’" + line_code[j-1][0] + "’/〉");; 
break;; 
case 3: 
document.write("〈v:oval id=’_x0000_s1026’ style=’position:absolute;;left:" + (x1 - 2) + "px;;top:" + (y1 - 2) + "px;;width:4px;;height:4px;;z-index:1’ fillcolor=’" + line_code[j-1][0] + "’ strokecolor=’" + line_code[j-1][0] + "’/〉");; 
break;; 



switch (parseInt(line_code[j-1][3])) 

case 1: 
break;; 
case 2: 
document.write("〈v:rect id=’_x0000_s1027’ style=’position:absolute;;left:" + (x2 - 2) + "px;;top:" + (y2 - 2) + "px;;width:4px;;height:4px;; z-index:2’ fillcolor=’" + line_code[j-1][0] + "’ strokecolor=’" + line_code[j-1][0] + "’/〉");; 
break;; 
case 3: 
document.write("〈v:oval id=’_x0000_s1026’ style=’position:absolute;;left:" + (x2 - 2) + "px;;top:" + (y2 - 2) + "px;;width:4px;;height:4px;;z-index:1’ fillcolor=’" + line_code[j-1][0] + "’ strokecolor=’" + line_code[j-1][0] + "’/〉");; 
break;; 



for(var i=0;;i〈total_no-1;;i++) 

document.write("〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x + left_width + all_width * (i)/(total_no-1)) + "px," + (table_y + all_height) + "px’ to=’" + (table_x + left_width + all_width * (i)/(total_no-1)) + "px," + (table_y + all_height + 15) + "px’/〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + (table_x + left_width + all_width * (i)/(total_no-1)) + "px;;top:" + (table_y + all_height) + "px;;width:" + (all_width/(total_no-1)) + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’left’〉" + total[0][i] + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 

var tb_height = 30 
document.write("〈v:rect id=’_x0000_s1025’ style=’position:absolute;;left:" + (table_x + all_width + 20) + "px;;top:" + table_y + "px;;width:100px;;height:" + (line_no * tb_height + 20) + "px;;z-index:1’/〉");; 
for(var i=0;;i〈line_no;;i++) 

document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + (table_x + all_width + 25) + "px;;top:" + (table_y + 10+(i) * tb_height) + "px;;width:60px;;height:" + tb_height + "px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’left’〉" + line_code[i][4] + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 
document.write("〈v:rect id=’_x0000_s1040’ alt=’’ style=’position:absolute;;left:" + (table_x + all_width + 80) + "px;;top:" + (table_y + 10+(i) * tb_height + 4) + "px;;width:30px;;height:20px;;z-index:1’ fillcolor=’" + line_code[i][0] + "’〉〈v:fill color2=’" + line_code[i][0] + "’ rotate=’t’ focus=’100%’ type=’gradient’/〉〈/v:rect〉");; 


〈/script〉 
〈html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"〉 
〈!--[if !mso]〉 
〈style〉 
v:* { behavior: url(#default#VML) } 
o:* { behavior: url(#default#VML) } 
.shape { behavior: url(#default#VML) } 
〈/style〉 
〈![endif]--〉 
〈head〉 
〈meta http-equiv="Content-Type" content="text/html;; charset=gb2312"〉 
〈title〉〈/title〉 
〈style〉 
TD { FONT-SIZE: 9pt} 
〈/style〉〈/head〉 
〈body topmargin=5 leftmargin=0 scroll=AUTO〉 
〈script language=javascript〉 
var nameArray = new Array();; 
nameArray[0]="中国经营报" 
nameArray[1]="招聘网" 
nameArray[2]="51Job" 
nameArray[3]="新民晚报" 
nameArray[4]="新闻晚报" 
nameArray[5]="南方周末" 
nameArray[6]="羊城晚报" 
var dataArray1 = new Array() 
dataArray1[0]="#FF0000,1.5,1,2,公司1"//参数1线条的颜色,参数2线条的宽度,参数3线条的型,参数4转折点的型,参数5线条名称 
dataArray1[1]=200 
dataArray1[2]=1200 
dataArray1[3]=900 
dataArray1[4]=600 
dataArray1[5]=1222 
dataArray1[6]=413 
dataArray1[7]=800 
var dataArray2 = new Array() 
dataArray2[0]="#0000FF,1,2,3,公司2" 
dataArray2[1]=400 
dataArray2[2]=500 
dataArray2[3]=1040 
dataArray2[4]=1600 
dataArray2[5]=522 
dataArray2[6]=813 
dataArray2[7]=980 
var dataArray3 = new Array() 
dataArray3[0]="#004D00,1,1,3,公司3" 
dataArray3[1]=900 
dataArray3[2]=890 
dataArray3[3]=1240 
dataArray3[4]=1300 
dataArray3[5]=722 
dataArray3[6]=833 
dataArray3[7]=1280 
var total = new Array(nameArray,dataArray1,dataArray2,dataArray3) 
table2(total,100,90,600,250,3);; 
〈/script〉 
〈/body〉 
〈/html〉 

============================== 
JavaScript函数之饼图 
---------------------------- 
〈script language=javascript〉 
function table3(total,table_x,table_y,all_width,all_height,table_type) 

var tmdColor1 = new Array();; 

tmdColor1[0] = "#d1ffd1";; 
tmdColor1[1] = "#ffbbbb";; 
tmdColor1[2] = "#ffe3bb";; 
tmdColor1[3] = "#cff4f3";; 
tmdColor1[4] = "#d9d9e5";; 
tmdColor1[5] = "#ffc7ab";; 
tmdColor1[6] = "#ecffb7";; 

var tmdColor2 = new Array();; 

tmdColor2[0] = "#00ff00";; 
tmdColor2[1] = "#ff0000";; 
tmdColor2[2] = "#ff9900";; 
tmdColor2[3] = "#33cccc";; 
tmdColor2[4] = "#666699";; 
tmdColor2[5] = "#993300";; 
tmdColor2[6] = "#99cc00";; 

var tb_color = new Array(tmdColor1,tmdColor2);; 
var tb_height = 30;; 
var total_no = total[0].length;; 
var totalpie = 0;; 
for(var i=0;;i〈total_no;;i++) 

totalpie += total[1][i];; 

var PreAngle = 0;; 
for(var i=0;;i〈total_no;;i++) 

document.write("〈v:shape id=’_x0000_s1025’ alt=’’ style=’position:absolute;;left:" + table_x + "px;;top:" + table_y + "px;;width:" + all_width + "px;;height:" + all_height + "px;;z-index:1’ coordsize=’1500,1400’ o:spt=’100’ adj=’0,,0’ path=’m750,700ae750,700,750,700," + parseInt(23592960*PreAngle) + "," + parseInt(23592960*total[1][i]/totalpie) + "xe’ fillcolor=’" + tb_color[0][i] + "’ strokecolor=’#FFFFFF’〉〈v:fill color2=’" + tb_color[1][i] + "’ rotate=’t’ focus=’100%’ type=’gradient’/〉〈v:stroke joinstyle=’round’/〉〈v:formulas/〉〈v:path o:connecttype=’segments’/〉〈/v:shape〉");; 
PreAngle += total[1][i] / totalpie;; 


if(table_type=="A") 

document.write("〈v:rect id=’_x0000_s1025’ style=’position:absolute;;left:" + (table_x + all_width + 20) + "px;;top:" + (table_y + 20) + "px;;width:100px;;height:" + (total_no * tb_height + 20) + "px;;z-index:1’/〉");; 
for(var i=0;;i〈total_no;;i++) 

document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + (table_x + all_width + 25) + "px;;top:" + (table_y+30+(i)*tb_height) + "px;;width:60px;;height:" + tb_height + "px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’left’〉" + total[0][i] + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 
document.write("〈v:rect id=’_x0000_s1040’ alt=’’ style=’position:absolute;;left:" + (table_x + all_width + 80) + "px;;top:" + (table_y + 30 + (i)*tb_height+3) + "px;;width:30px;;height:20px;;z-index:1’ fillcolor=’" + tb_color[0][i] + "’〉〈v:fill color2=’" + tb_color[1][i] + "’ rotate=’t’ focus=’100%’ type=’gradient’/〉〈/v:rect〉");; 
//显示比例数 
//document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + (table_x+all_width+110) + "px;;top:" + (table_y+30+(i)*tb_height) + "px;;width:60px;;height:" + tb_height + "px;;z-index:1’〉");; 
//document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’left’〉" + Math.round(parseFloat(total[1][i]*100/totalpie)*100)/100 + "%〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 



if(table_type == "B") 

var pie = 3.14159265358979;; 
var TempPie = 0;; 
for(var i=0;;i〈total_no;;i++) 

var TempAngle = pie * 2 * (total[1][i] / (totalpie * 2) + TempPie);; 
var x1 = table_x + all_width/2 + Math.cos(TempAngle) * all_width * 3/8;; 
var y1 = table_y + all_height/2 - Math.sin(TempAngle) * all_height * 3/8;; 
var x2 = table_x + all_width/2 + Math.cos(TempAngle) * all_width * 3/4;; 
var y2 = table_y + all_height/2 - Math.sin(TempAngle) * all_height * 3/4;; 

if(x2〉table_x + all_width/2) 

x3 = x2 + 20;; 
x4 = x3;; 

else 

x3 = x2 - 20;; 
x4 = x3 - 100;; 

document.write("〈v:oval id=’_x0000_s1027’ style=’position:absolute;;left:" + (x1 - 2) + "px;;top:" + (y1 - 2) + "px;;width:4px;;height:4px;; z-index:2’ fillcolor=’#111111’ strokecolor=’#111111’/〉");; 
document.write("〈v:line id=’_x0000_s1025’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;z-index:1’ from=’" + x1 + "px," + y1 + "px’ to=’" + x2 + "px," + y2 + "px’ coordsize=’21600,21600’ strokecolor=’#111111’ strokeweight=’1px’〉〈/v:line〉");; 
document.write("〈v:line id=’_x0000_s1025’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;z-index:1’ from=’" + x2 + "px," + y2 + "px’ to=’" + x3 + "px," + y2 + "px’ coordsize=’21600,21600’ strokecolor=’#111111’ strokeweight=’1px’〉〈/v:line〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + x4 + "px;;top:" + (y2 - 10) + "px;;width:100px;;height:20px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’left’〉" + total[0][i] + " " + Math.round(parseFloat(total[1][i] * 100/ totalpie)*100)/100 + "%〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉") 
TempPie += total[1][i]/totalpie;; 



〈/script〉 
〈html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"〉 
〈!--[if !mso]〉 
〈style〉 
v:* { behavior: url(#default#VML) } 
o:* { behavior: url(#default#VML) } 
.shape { behavior: url(#default#VML) } 
〈/style〉 
〈![endif]--〉 
〈head〉 
〈meta http-equiv="Content-Type" content="text/html;; charset=gb2312"〉 
〈title〉〈/title〉 
〈style〉 
TD { FONT-SIZE: 9pt} 
〈/style〉〈/head〉 
〈body topmargin=5 leftmargin=0 scroll=AUTO〉 
〈script language=javascript〉 
//=============调用方法===================== 
var dataArray = new Array() 
dataArray[0]=200 
dataArray[1]=1200 
dataArray[2]=900 
dataArray[3]=600 
dataArray[4]=1222 
dataArray[5]=413 
dataArray[6]=800 
var nameArray = new Array() 
nameArray[0]="中国经营报" 
nameArray[1]="招聘网" 
nameArray[2]="51Job" 
nameArray[3]="新民晚报" 
nameArray[4]="新闻晚报" 
nameArray[5]="南方周末" 
nameArray[6]="羊城晚报" 
var total= new Array(nameArray,dataArray) 
table3(total,200,40,250,250,"A");; 
table3(total,300,450,250,250,"B");; 
〈/script〉 
〈/body〉 
〈/html〉 

================================== 
JavaScript函数之柱状图 
-------------------------------- 
〈script language=javascript〉 
function table1(total,table_x,table_y,thickness,table_width,all_width,all_height,table_type){ 
var tmdColor1 = new Array();; 
tmdColor1[0] = "#d1ffd1";; 
tmdColor1[1] = "#ffbbbb";; 
tmdColor1[2] = "#ffe3bb";; 
tmdColor1[3] = "#cff4f3";; 
tmdColor1[4] = "#d9d9e5";; 
tmdColor1[5] = "#ffc7ab";; 
tmdColor1[6] = "#ecffb7";; 
var tmdColor2 = new Array();; 
tmdColor2[0] = "#00ff00";; 
tmdColor2[1] = "#ff0000";; 
tmdColor2[2] = "#ff9900";; 
tmdColor2[3] = "#33cccc";; 
tmdColor2[4] = "#666699";; 
tmdColor2[5] = "#993300";; 
tmdColor2[6] = "#99cc00";; 
var tb_color = new Array(tmdColor1,tmdColor2);; 
var line_color = "#69f";; 
var left_width = 70;; 
var length = thickness/2;; 
var total_no = total[0].length;; 
var temp1 = 0;; 
var temp2,temp4,temp4;; 
for(var i = 0;;i〈total_no;;i++) 

if(temp1〈total[0][i]) 

temp1 = total[0][i];; 


temp1 = parseInt(temp1.toString());; 
if(temp1〉9) 

temp2 = temp1.toString().substr(1,1) 
if(temp2〉4) 

temp3 = (parseInt((temp1/(Math.pow(10,(temp1.toString().length-1)))).toString())+1)*Math.pow(10,(temp1.toString().length-1));; 

else 

temp3 = (parseInt((temp1/(Math.pow(10,(temp1.toString().length-1)))).toString())+0.5)*Math.pow(10,(temp1.toString().length-1));; 


else 

if(temp1〉4) 
temp3 = 10;; 
else 
temp3 = 5;; 

temp4=temp3 
document.write("〈!--[if gte vml 1]〉〈v:rect id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:" + (table_x+left_width) + "px;;top:" + table_y + "px;;width:" + all_width + "px;;height:" + all_height + "px;;z-index:-1’ fillcolor=’#9cf’ stroked=’f’〉〈v:fill rotate=’t’ angle=’-45’ focus=’100%’ type=’gradient’/〉〈/v:rect〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width) + "px," + (table_y+all_height) + "px’ to=’" + (table_x+all_width+left_width) + "px," + (table_y+all_height) + "px’/〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width) + "px," + table_y + "px’ to=’" + (table_x+left_width) + "px," + (table_y+all_height) + "px’/〉〈![endif]--〉");; 

switch (table_type) 

case "A": 

var table_space = (all_width-table_width*total_no)/total_no;; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width+length) + "px,"+ table_y + "px’ to=’" + (table_x+left_width+length) + "px," + (table_y+all_height-length) + "px’ strokecolor=’" + line_color + "’/〉〈![endif]--〉");; 

for(var i=0;;i〈=all_height-1;;i+= all_height/5) 

document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width)+ "px," + (table_y+all_height-length-i) + "px’ to=’" + (table_x+left_width+length) + "px," + (table_y+all_height-i) +"px’ strokecolor=’" + line_color + "’/〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width+length) + "px," + (table_y+all_height-length-i) + "px’ to=’" + (table_x+all_width+left_width) + "px," + (table_y+all_height-length-i) + "px’ strokecolor=’" + line_color + "’/〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+(left_width-15)) + "px," + (table_y+i) + "px’ to=’" + (table_x+left_width) + "px," + (table_y+i) + "px’/〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + table_x + "px;;top:" + (table_y+i) + "px;;width:" + left_width + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’right’〉" + temp4 + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉〈![endif]--〉");; 
temp4 = temp4-temp3/5;; 

for(var i=0;;i〈total_no;;i++) 


var temp_space = table_x + left_width + table_space / 2 + table_space * i + table_width * i;; 
document.write("〈v:rect id=’_x0000_s1025’ alt=’’ style=’position:absolute;;left:");; 
document.write(temp_space);; 
document.write("px;;top:");; 
document.write(table_y + all_height * (1 - (total[0][i] / temp3)));; 
document.write("px;;width:" + table_width + "px;;height:" + all_height * (total[0][i] / temp3) + "px;;z-index:1’ fillcolor=’" + tb_color[1][i] + "’〉");; 
document.write("〈v:fill color2=’" + tb_color[0][i] + "’ rotate=’t’ type=’gradient’/〉") 
document.write("〈o:extrusion v:ext=’view’ backdepth=’" + thickness + "pt’ color=’" + tb_color[1][i] + "’ on=’t’/〉");; 
document.write("〈/v:rect〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + temp_space + "px;;top:" + (table_y+all_height*(1-(total[0][i]/temp3))-table_width) + "px;;width:" + (table_space+15) + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’center’〉" + total[0][i] + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + (temp_space-table_space/2) + "px;;top:" + (table_y+all_height+1) + "px;;width:" + (table_space+table_width) + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’center’〉" + total[1][i] + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 


break;; 
case "B": 
var table_space = (all_height - table_width * total_no) / total_no;; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width+length) + "px," + (table_y+all_height-length) + "px’ to=’" + (table_x+left_width+all_width) + "px," + (table_y+all_height-length) + "px’ strokecolor=’" + line_color + "’/〉〈![endif]--〉");; 
temp4 =temp3/5;; 
for(var i=0;;i〈=all_width-1;;i +=all_width/5) 

document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width+i) + "px," + (table_y+all_height-length) + "px’ to=’" + (table_x+left_width+length+i) + "px," + (table_y+all_height) + "px’ strokecolor=’" + line_color + "’/〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width+length+i) + "px," + (table_y+all_height-length) + "px’ to=’" + (table_x+left_width+length+i) + "px," + table_y + "px’ strokecolor=’" + line_color + "’/〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉〈v:line id=’_x0000_s1027’ alt=’’ style=’position:absolute;;left:0;;text-align:left;;top:0;;flip:y;;z-index:-1’ from=’" + (table_x+left_width+i+all_width/5) + "px," + (table_y+all_height) + "px’ to=’" + (table_x+left_width+i+all_width/5) + "px," + (table_y+all_height+15) + "px’/〉〈![endif]--〉");; 
document.write("〈!--[if gte vml 1]〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + (table_x+left_width+i+all_width/5-left_width) + "px;;top:" + (table_y+all_height) + "px;;width:" + left_width + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’right’〉" + temp4 + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉〈![endif]--〉");; 
temp4 = temp4 + temp3 / 5;; 


for(var i=0;;i〈total_no;;i++) 

var temp_space = table_space/2 + table_space * i + table_width * i;; 
document.write("〈v:rect id=’_x0000_s1025’ alt=’’ style=’position:absolute;;left:");; 
document.write(table_x + left_width);; 
document.write("px;;top:");; 
document.write(table_y + temp_space);; 
document.write("px;;width:" + all_width * (total[0][i] / temp3) + "px;;height:" + table_width + "px;;z-index:1’ fillcolor=’" + tb_color[1][i] + "’〉");; 
document.write("〈v:fill color2=’" + tb_color[0][i] + "’ rotate=’t’ angle=’-90’ focus=’100%’ type=’gradient’/〉");; 
document.write("〈o:extrusion v:ext=’view’ backdepth=’" + thickness + "pt’ color=’" + tb_color[1][i] + "’ on=’t’/〉");; 
document.write("〈/v:rect〉");; 
document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + (table_x + left_width + all_width * (total[0][i] / temp3) + thickness / 2) + "px;;top:" + (table_y + temp_space) + "px;;width:" + (table_space + 15) + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’center’〉" + total[0][i] + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 

document.write("〈v:shape id=’_x0000_s1025’ type=’#_x0000_t202’ alt=’’ style=’position:absolute;;left:" + table_x + "px;;top:" + (table_y + temp_space) + "px;;width:" + left_width + "px;;height:18px;;z-index:1’〉");; 
document.write("〈v:textbox inset=’0px,0px,0px,0px’〉〈table cellspacing=’3’ cellpadding=’0’ width=’100%’ height=’100%’〉〈tr〉〈td align=’right’〉" + total[1][i] + "〈/td〉〈/tr〉〈/table〉〈/v:textbox〉〈/v:shape〉");; 




〈/script〉 
〈html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"〉 
〈!--[if !mso]〉 
〈style〉 
v:* { behavior: url(#default#VML) } 
o:* { behavior: url(#default#VML) } 
.shape { behavior: url(#default#VML) } 
〈/style〉 
〈![endif]--〉 
〈head〉 
〈meta http-equiv="Content-Type" content="text/html;; charset=gb2312"〉 
〈title〉〈/title〉 
〈style〉 
TD { FONT-SIZE: 9pt} 
〈/style〉〈/head〉 
〈body topmargin=5 leftmargin=0 scroll=AUTO〉 
〈script language=javascript〉 
//=============调用方法===================== 
var dataArray = new Array() 
dataArray[0]=200 
dataArray[1]=800 
dataArray[2]=1000 
dataArray[3]=600 
dataArray[4]=1222 
dataArray[5]=3213 
dataArray[6]=8 
var nameArray = new Array() 
nameArray[0]="中国经营报" 
nameArray[1]="招聘网" 
nameArray[2]="51Job" 
nameArray[3]="新民晚报" 
nameArray[4]="新闻晚报" 
nameArray[5]="南方周末" 
nameArray[6]="羊城晚报" 
var total= new Array(dataArray,nameArray) 
table1(total,200,20,20,30,400,200,"A");; 
table1(total,200,320,20,20,400,250,"B") 
〈/script〉 
〈/body〉 
〈/html〉

中查找“JavaScript实现 折线图、饼图、柱状图”更多相关内容

中查找“JavaScript实现 折线图、饼图、柱状图”更多相关内容



上一篇:强制弹出页面+自动最小化广告代码
下一篇:点击链接时加音效
最近更新 赞助商
·浏览器对Cookie的限制11-10
·JavaScript中的排序函数sort10-28
·初学Javascript的总结10-24
·如何禁止被Iframe?10-16
·Javascript页面宽度高度09-09
·怎样从 Javascript 传递一个变量到 PHP09-09
·Javascript刷新页的方法汇总09-09
·Javascript脚本:Location对象09-05
·js文件封装javascript在html中获取url参数09-05
·Javascript引擎性能比较: Google Chrome..09-05
·javascript定义类和实例化类09-05

共有评论 0 条 网友评分 0分 查看所有评论


发表评论→ 学而不思则罔,思而不学则殆,请大胆发表你的见解。

输验证码:

您对此篇文章的评分:1分 2分 3分 4分 5分

  • 站内搜索
关键词

搜索方式

搜索范围

精确匹配
Baidu
网站首页 - 关于本站 - 网站地图 - 广告合作 - 站点声明 - RSS订阅 - 联系我们
Copyright © 2005 网海拾贝.[新ICP备05003216号]. All Rights Reserved .