Open-Flash-Chart使用说明（javascript例子）

yuyanshan
浏览: 49103 次
性别:
来自: 广州
最近访客更多访客>>

mazhongxing_jay
skying007
linqiang1991
博主相关

博客
微博
相册
留言
关于我
文章分类

社区版块

存档分类

JavaScript Flash
SWFObject ：addParam("paraName","value")     Flash内联参数；

                                 addVariable("variaName","value")采用"Flashvars"参数传入变量

            饼图：         

           <div id="my_chart">
             <script type="text/javascript">
              var so = new SWFObject("/utk_pie.swf", "ofc", "750", "350", "9", "#FFFFFF");
               so.addVariable("variables","true");
              so.addVariable("pie", "60,#9933CC,#000000");//600是颜色深度
              //so.addVariable("values", "3,2,1,1,1,1,0.2");//数字的意思是百分比
              so.addVariable("colours", "#d01f3c,#356aa0,#C79810,#0033FF,#33CCCC,#EEEE11");
              so.addVariable("links", "javascript:alert('Jan 3'),javascript:alert('中文 2')");
              var visitrate = ""; 
              var visitname="";            
              var tmp;
              <s:iterator value="getList" status="st">
               <s:if test="#request.st.index < 10">
               tmp = "<s:property value='reportPvisitPrate' />" ;                        
               visitrate = visitrate + tmp + ","; 
               tmp = "<s:property value='nameforReport' />";
               visitname = visitname + tmp + ","; 
              </s:if>         
              </s:iterator> 
              visitrate = visitrate.substring(0,visitrate.length-1);
              visitname = visitname.substring(0,visitname.length-1);
              so.addVariable("links", "http://www.baidu.com");
              so.addVariable("pie_show",visitname);//鼠标放上去显示的名字
              so.addVariable("values", visitrate);//数字的意思是百分比
              so.addVariable("pie_labels", visitname);//左边名字             
              so.addParam("allowScriptAccess", "always" );//"sameDomain");
              so.write("my_chart");
             </script>
             </div>

           柱状图：

<div id="my_chart" style="padding: 0px; margin:10px; border: 1px solid lightblue; width: 710px; height: 200px;"></div> 
            <script type="text/javascript">
             var so = new SWFObject("/open-flash-chart.swf", "ofc", "700", "180", "9", "#FFFFFF");
             so.addParam("wmode","transparent");        
             so.addVariable("variables","true");
             so.addVariable("bg_colour","0xFFFFFF");//背景颜色
              so.addVariable("x_grid_colour","#E8EDF8");//x轴grid底的颜色
              so.addVariable("y_grid_colour","#E8EDF8");//y轴grid底的颜色
              so.addVariable("x_axis_colour","#D9E4F3");//x坐标的颜色
              so.addVariable("y_axis_colour","#D9E4F3");//y坐标的颜色
              so.addVariable("x_label_style","12,#5B719D,,2");//x轴坐标的文字样式,12-size，#5B719D-颜色指
              so.addVariable("y_label_style","12,#5B719D");//y轴坐标的文字样,12-size，#5B719D-颜色指式
              so.addVariable("title","标题,{font-size: 20;color:#5284C7}");
              so.addVariable("y_legendx","Open Flash Chart,12,0x736AFF");
              //so.addVariable("y_label_size","15");
              so.addVariable("y_ticks","5,10,4");//5是左侧横线长度,10是左侧最上和最下横线的长度,4是左侧 分 多少格与左边数字最大值对应
              so.addVariable("bar_glass","40,0x9933CC,Page views,10");//50默认透明度
            
              var strName = "";
              var strVisitTimes = "";
              var strlink="";
              var tmp;
              var max=0;
             
              <s:iterator value="getList">
              tmp = "<s:property value='nameforReport' />" ;
             
              strName = strName + tmp + " " +" ,";
              strlink+="javascript:alert(\'"+tmp+"\'),";
              tmp = <s:property value="visitPtimes" />;
              if(tmp>max)
              {
               max=tmp;
              }
              strVisitTimes = strVisitTimes + tmp + ",";
              </s:iterator>
              max = max*1.15;
              strName = strName.substring(0,strName.length-1);
              strVisitTimes = strVisitTimes.substring(0,strVisitTimes.length-1);
              strlink = strlink.substring(0,strlink.length-1);          
             so.addVariable("values",strVisitTimes);//柱形的值
             //so.addVariable("links", strlink);
             so.addVariable("x_labels","0时,1时,2时,3时,4时,5时,6时,7时,8时,9时,10时,11时,12时");
             //so.addVariable("x_labels",strName);
             so.addVariable("x_axis_steps","1");//x轴背景横线格间隔长度  
             so.addVariable("y_axis_steps","0.5");//Y轴背景横线格间隔长度 
             so.addVariable("tool_tip","时间段:#x_label#<br>访问量:#val#");//tooltip鼠标放上去显示内容
             so.addVariable("y_max",max);//左边数字最大值              
             so.addParam("allowScriptAccess", "always" );//"sameDomain");
             so.addParam("onmouseout", "onrollout2();" );
             so.write("my_chart");
            </script>
           </div>

         线状：

<script type="text/javascript">            
                
              var so = new SWFObject("/open-flash-chart.swf", "ofc", "730", "300", "9", "#FFFFFF");
              so.addParam("wmode","transparent");                    
              so.addVariable("variables","true");
              so.addVariable("bg_colour","0xFFFFFF");//背景颜色
              so.addVariable("x_grid_colour","#E8EDF8");//x轴grid底的颜色
              so.addVariable("y_grid_colour","#E8EDF8");//y轴grid底的颜色
              so.addVariable("x_axis_colour","#D9E4F3");//x坐标的颜色
              so.addVariable("y_axis_colour","#D9E4F3");//y坐标的颜色
              so.addVariable("x_label_style","12,#5B719D");//x轴坐标的文字样式,12-size，#5B719D-颜色指
              so.addVariable("y_label_style","12,#5B719D");//y轴坐标的文字样,12-size，#5B719D-颜色指式
              so.addVariable("title","标题,{font-size: 20;color:#5284C7}");//顶端字
              //so.addVariable("y_legend","中文1123,12,#736AFF");//左侧字
              //so.addVariable("x_legend","进入流量总体报,12,#736AFF");//底端字
              so.addVariable("y_label_size","15");//没用
              so.addVariable("y_ticks","5,10,4");//5是左侧线的长短,10是左侧线上下线的长短,4是左侧分及格
              //so.addVariable("area_hollow","1.2,3,35,#CC3399,访问次数,10");//area_hollow代表空心圆,3是节点的大小,2是线的粗细,25线型图的背景颜色深浅

              so.addVariable("line_dot","3,#2C5839,横坐标标题1,10,5");
              so.addVariable("line_dot_2","3,#4C5839,横坐标标题2,10,5");
                           var str1 = "";
              var str2 = "";
              var strTime="";
              var tmp1;
              var tmp2;
                         var tmpTime;
              var max = 0;
              <s:iterator value="pageList" status="str">
              tmp1 = <s:property value="qeesooClick" />;            
              str1 = str1 + tmp1 + ",";  
              
              tmp2 = <s:property value="baiduClick" />;            
              str2 = str2 + tmp2 + ","; 
                           
              tmpTime = "<s:property value="reportDate" />";
              strTime = strTime + tmpTime + ",";
              var values =new Array(tmp1,tmp2,tmp3,tmp4,tmp5);
                   
              for(var i=0;i<values.length;i++)
              {
               if(values[i]>max)
               {
                max = values[i];
               }
              }  
              </s:iterator>
              max = max * 1.10;
              str1 = str1.substring(0,str1.length-1);
         
              str2 = str2.substring(0,str2.length-1)；
              strTime = strTime.substring(0,strTime.length-1);
             
              so.addVariable("values",str1);
              so.addVariable("values_2",str2);
              so.addVariable("x_labels",strTime);      
              so.addVariable("x_axis_steps","1");//背景格的大小
              so.addVariable("y_max",max);//图形的高度         
              so.addParam("allowScriptAccess", "always" );//"sameDomain");
              so.write("my_chart");                    
            </script>
分享到：