免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
js+vml的統(tǒng)計(jì)圖表類-霜之哀傷-搜狐博客

js+vml的統(tǒng)計(jì)圖表類

2006-07-08 16:01
<script>
document.write("<html xmlns:v><style>v\\:*{behavior:url(#default#VML)}</style>")
var ct1=new ct()
function ct(){
   this.ac="green,yellow,red,blue,gray".split(",")
   this.getCss=function(css,k,df){
       if(css==null)
           return def==null ? "" : df
       var r=new RegExp("(^|)"+k+":([^\;]*)(\;|$)","gi")
       var a=r.exec(css.replace(/=/g,":").replace(/ /g,"").toLowerCase())
       return a==null ? (df==null ? "" : df) : (isNaN(a[2])||a[2]=="" ? a[2] : parseInt(a[2]))
   }
   this.bar=function(vList,css){
       var l="",a,n,s,hsz,max=0,cx=20,ch
       var pw=this.getCss(css,"width",500),ph=this.getCss(css,"height",300)
       if(ph<150||pw<150){
           alert("圖表區(qū)域太小,中斷輸出!")
           return
       }
       a=vList.split(";")
       for(var i in a){
           a[i]=a[i].split(",")
           for(var j in a[i]){
               if(i>0&&j>0)
                   if(parseInt(a[i][j])>max)
                       max=parseInt(a[i][j])
           }
       }
       if(max==0)
           return
       hsz=(ph-100)/max
       n=(vList.length-vList.replace(/;/g,"").replace(/,/g,"").length)*20+20
       if(pw<n)
           pw=n
       l+="<v:rect fillcolor='"+this.getCss(css,"background","white")+"' style='position:absolute;left:0;top:0;width:"+pw+";height:"+ph+"'><v:shadow on=t type=emboss opacity=80% offset='3px,3px' offset2='5px,5px' /></v:rect>"
       l+="<v:line from="+30+","+(ph-30)+" to="+30+","+10+"><v:stroke startarrow=none endarrow=classic /></v:line>"
       l+="<v:line from="+30+","+(ph-30)+" to="+(pw-10)+","+(ph-30)+"><v:stroke startarrow=none endarrow=classic /></v:line>"
       l+="<span style='position:absolute;z-index:3;font:12;left:220;top:10'>"+this.getCss(css,"title")+"</span>"
       l+="<span style='position:absolute;z-index:3;font:12;left:"+(pw-50)+";top:"+(ph-20)+"'>"+a[0][0]+"</span>"
       l+="<span style='position:absolute;z-index:3;font:12;left:10;top:10;width:5;word-break:break-all'>"+this.getCss(css,"vname")+"</span>"

       for(i=0;i<5;i++){
           l+="<v:line from="+30+","+(70+i*(ph-100)/5)+" to="+(pw-10)+","+(70+i*(ph-100)/5)+" strokecolor=#c0c0c0><v:stroke dashstyle=dash /></v:line>"
           l+="<span style='position:absolute;z-index:3;font:12;left:"+10+";top:"+(65+i*(ph-100)/5)+"'>"+(parseInt(max)*(5-i)/5)+"</span>"
       }
       
       for(i in a){
           for(j in a[i]){
               if(i==0){
                   if(j>0){
                       l+="<v:rect fillcolor='"+this.ac[j-1]+"' style='position:absolute;left:"+(j*80-20)+";top:30;width:20;height:20' />"
                       l+="<span style='position:absolute;z-index:3;font:12;left:"+(j*80+5)+";top:35'>"+a[i][j]+"</span>"
                   }
               }
               else{
                   if(j==0)
                       l+="<span style='position:absolute;z-index:3;font:12;left:"+cx+";top:"+(ph-25)+"'>"+a[i][j]+"</span>"
                   else{
                       ch=a[i][j]*hsz
                       l+="<v:rect title='"+a[i][j]+"' fillcolor='"+this.ac[j-1]+"' style='position:absolute;left:"+cx+";top:"+(ph-30-ch)+";width:20;height:"+ch+"' />"
                       if(this.getCss(css,"showVal")=="t")
                           l+="<span style='position:absolute;z-index:3;font:12;left:"+(cx+3)+";top:"+(ph-42-ch)+"'>"+a[i][j]+"</span>"
                       cx+=20
                   }
               }
           }
           cx+=20
       }
       return l
   }
   this.lines=function(vList,css){
       var l="",a,n,s,hsz,max=0,ch
       var pw=this.getCss(css,"width",500),ph=this.getCss(css,"height",300)
       if(ph<150||pw<150){
           alert("圖表區(qū)域太小,中斷輸出!")
           return
       }
       a=vList.split(";")
       for(var i in a){
           a[i]=a[i].split(",")
           for(var j in a[i]){
               if(i>0&&j>0)
                   if(parseInt(a[i][j])>max)
                       max=parseInt(a[i][j])
           }
       }
       if(max==0)
           return
       hsz=(ph-100)/max
       n=a.length*40+40
       if(pw<n)
           pw=n
       l+="<v:rect fillcolor='"+this.getCss(css,"background","white")+"' style='position:absolute;left:0;top:0;width:"+pw+";height:"+ph+"'><v:shadow on=t type=emboss opacity=80% offset='3px,3px' offset2='5px,5px' /></v:rect>"
       l+="<v:line from="+30+","+(ph-30)+" to="+30+","+10+"><v:stroke startarrow=none endarrow=classic /></v:line>"
       l+="<v:line from="+30+","+(ph-30)+" to="+(pw-10)+","+(ph-30)+"><v:stroke startarrow=none endarrow=classic /></v:line>"
       l+="<span style='position:absolute;z-index:3;font:12;left:"+(pw-50)+";top:"+(ph-20)+"'>"+this.getCss(css,"xname")+"</span>"
       l+="<span style='position:absolute;z-index:3;font:12;left:10;top:10;width:5;word-break:break-all'>"+a[0][0]+"</span>"
       l+="<span style='position:absolute;z-index:3;font:12;left:220;top:10'>"+this.getCss(css,"title")+"</span>"

       for(i=0;i<5;i++){
           l+="<v:line from="+30+","+(70+i*(ph-100)/5)+" to="+(pw-10)+","+(70+i*(ph-100)/5)+" strokecolor=#c0c0c0><v:stroke dashstyle=dash /></v:line>"
           l+="<span style='position:absolute;z-index:3;font:12;left:"+10+";top:"+(65+i*(ph-100)/5)+"'>"+(parseInt(max)*(5-i)/5)+"</span>"
       }
       
       for(i in a){
           for(j in a[i]){
               if(i==0){
                   if(j>0){
                       l+="<v:rect fillcolor='"+this.ac[j-1]+"' style='position:absolute;left:"+(j*80-20)+";top:30;width:20;height:20' />"
                       l+="<span style='position:absolute;z-index:3;font:12;left:"+(j*80+5)+";top:35'>"+a[i][j]+"</span>"
                   }
               }
               else{
                   if(j==0)
                       l+="<span style='position:absolute;z-index:3;font:12;left:"+(i*40)+";top:"+(ph-25)+"'>"+a[i][j]+"</span>"
                   else{
                       ch=a[i][j]*hsz
                       if(i>1){
                           oh=parseInt(a[i-1][j]*hsz)
                           l+="<v:line from="+((i-1)*40)+","+(ph-oh-30)+" to="+(i*40)+","+(ph-ch-30)+" strokecolor='"+this.ac[j-1]+"' />"
                       }
                       l+="<v:rect title='"+a[i][j]+"' fillcolor='"+this.ac[j-1]+"' style='z-index:3;position:absolute;left:"+(i*40-1)+";top:"+(ph-ch-31)+";width:3;height:"+3+"' />"
                       if(this.getCss(css,"showVal")=="t")
                           l+="<span style='position:absolute;z-index:3;font:12;left:"+(i*40-5)+";top:"+(ph-ch-42)+"'>"+a[i][j]+"</span>"
                   }
               }
           }
       }
       return l
   
   }
   this.pie=function(vList,css){
       var l="",a,i,j,n,s,amt,dx=0
       var pw=this.getCss(css,"width",500),ph=this.getCss(css,"height",300)
       if(ph<150||pw<150){
           alert("圖表區(qū)域太小,中斷輸出!")
           return
       }
       a=vList.split(";")
       n=a.length*170-130
       if(pw<n)
           pw=n
       l+="<v:rect fillcolor='"+this.getCss(css,"background","white")+"' style='position:absolute;left:0;top:0;width:"+pw+";height:"+ph+"'><v:shadow on=t type=emboss opacity=80% offset='3px,3px' offset2='5px,5px' /></v:rect>"
       l+="<span style='position:absolute;z-index:3;font:12;left:220;top:10'>"+this.getCss(css,"title")+"</span>"
       if(a.length==2)
           dx=pw/2-100
       if(a.length==3)
           dx=pw/2-180
       for(i in a){
           a[i]=a[i].split(",")
           amt=0
           for(j=1;j<a[i].length;j++){
               amt+=parseFloat(a[i][j])
           }
           sa=0
           for(j in a[i]){
               if(i==0){
                   if(j>0){
                       l+="<v:rect fillcolor='"+this.ac[j-1]+"' style='position:absolute;left:"+(j*80-20)+";top:30;width:20;height:20' />"
                       l+="<span style='position:absolute;z-index:3;font:12;left:"+(j*80+5)+";top:35'>"+a[i][j]+"</span>"
                   }
               }
               else{
                   if(j==0){
                       l+="<span style='position:absolute;z-index:3;font:12;left:"+(i*170-90+dx)+";top:"+(ph-50)+"'>"+a[i][j]+"("+amt+")</span>"
                   }
                   else{
                       ea=a[i][j]*360/amt+sa
                       if(j==a[i].length-1)
                           ea=0
                       if(a[i][j]>0)
                           l+=this.getPie(60,sa,ea,"title:"+a[i][j]+";val:"+(parseInt((10000*a[i][j]/amt))/100)+"%;x:"+(i*170-70+dx)+";y:"+(ph/2+10)+";background:"+this.ac[j-1])
                       sa=ea
                   }
               }
           }
       }
       return l
   }
   this.getPie=function(r,sa,ea,css){
       var sf,ef,sx,sy,ex,ey
       var title=this.getCss(css,"title"),val=this.getCss(css,"val")
       var x=parseInt(this.getCss(css,"x",0)),y=parseInt(this.getCss(css,"y",0))
       sf=Math.PI*(sa/180)
       ef=Math.PI*(ea/180)
       sy=parseInt(r*Math.sin(sf))
       sx=parseInt(r*Math.cos(sf))
       ey=parseInt(r*Math.sin(ef))
       ex=parseInt(r*Math.cos(ef))
       
       s="m0,0l"+sx+","+sy+"ar-"+r+",-"+r+","+r+","+r+","+ex+","+ey+","+sx+","+sy+",l0,0xe"
       l="<v:shape path='"+s+"' title='"+title+"' coordsize=1,1 style='position:absolute;width:1;height:1;left:"+this.getCss(css,"x","0")+";top:"+this.getCss(css,"y","0")+"' fillcolor='"+this.getCss(css,"background","white")+"' />"
       if(ef==0)
           ef=270
       var cx=(r+10)*Math.cos((sf+ef)/2),cy=(r+10)*Math.sin((sf+ef)/2)
       l+="<span style='position:absolute;z-index:3;font:12;left:"+(cx+x-10)+";top:"+(cy+y-5)+"'>"+val+"</span>"
       return l
   }
   this.draw=function(vList,css){
       var l,type=this.getCss(css,"type")
       if(type=="pie")
           l=this.pie(vList,css)
       else if(type=="lines")
           l=this.lines(vList,css)
       else
           l=this.bar(vList,css)
       return l
   }
}
</script>
<html>
<body style=margin:0>
<div id=div1 style=position:absolute;top:0;cursor:default>
</div>
<div id=div2 style=position:absolute;top:300;cursor:default>
</div>
<div id=div3 style=position:absolute;top:600;cursor:default>
</div>

</html>
<script>
//---柱形圖
div1.innerHTML=ct1.draw("季度,東部,中部,北部;1季度,20.4,30.6,90;2季度,27.4,38.6,34.6;3季度,45.9,0,0","type:bar;showVal:t;vname:銷售額;title:月統(tǒng)計(jì)圖")
//---線形圖
div2.innerHTML=ct1.draw("季度,東部,中部,北部;1季度,20.4,30.6,90;2季度,27.4,38.6,34.6;3季度,45.9,0,0","type:lines;showVal:t;vname:銷售額;title:月統(tǒng)計(jì)圖")
//---餅形圖
div3.innerHTML=ct1.draw("季度,東部,中部,北部;1季度,20.4,30.6,90;2季度,27.4,38.6,34.6;3季度,45.9,0,0","type:pie;showVal:t;vname:銷售額;title:月統(tǒng)計(jì)圖")

</script>
本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報(bào)。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
一個漂亮的頁面日歷+時鐘_javascript_博客-java,j2ee,java框架,s...
網(wǎng)頁背景圖片代碼
請教CSS中的position:relative;的作用。
CSS特效賞析---------------再續(xù)
對CSS中的Position、Float屬性的一些深入探討
HTML5與CSS3設(shè)計(jì)模式
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服