资源描述:
《open flash chart图表》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、OpenFlashChart图表OpenFlashChart图表的JSON格式基本属性详解数据文件必须是JSON格式.JSON对象的基本格式:{}把所有对象都编写在{}里面.让它看起来像下面JSON数据格式:{"title":{"text":"Manydatalines","style":"{font-size:20px;color:#0000ff;font-family:Verdana;text-align:center;}"}}Title(可选)所有属性参数都可选的.text:string,标题s
2、tyle:string,CSS样式例子:{"title":{"text":"Yedeer.com.cndataline","style":"{font-size:20px;color:#000000;font-family:Verdana;text-align:center;}"}}Y_Legend(可选)所有属性参数都是可选.text:string,Y轴标题style:string,CSS样式例子:{"y_legend":{"text":"Yedeer.com.cnChart","style":"{
3、color:#736AEF;font-size:12px;}"}}XAxis(可选)这个对象的属性是可选的,如果没有指定属性将使用默认的X轴属性.所有可选属性:stroke:number,X轴线的宽度tick-height:number,X轴刻度线高度值colour:string,线的颜色offset:boolean,柱状图表中X轴的偏移最小值是0grid-color:string,表格线颜色3d:boolean,设置3Dsteps:取决于tick-height属性labels:arrayofstri
4、ngs,每个X点的标签例子:{"x_axis":{"stroke":1,"tick-height":10,"colour":"#d000d0","grid-colour":"#00ff00","labels":["January,"February","March","April","May","June","July","August","Spetember"]}}YAxis(可选)应该属性和XAxis差不多(因为官方没给出,不知道是不是编漏了)min:integer,Y轴最小值max:intege
5、r,Y轴最大值tick-length:number,Y轴刻度线长度例子:{"y_axis":{"stroke":4,"tick-length":3,"colour":"#d000d0","grid-colour":"#00ff00","offset":0,"max":20}}Elements元素元素的属性是一个数组的通用对象这些通用对象图表类型为(line,bar,scatter等等){"elements":[{"type":"bar","alpha":0.5,"colour":"#9933CC","
6、text":"Pageviews","font-size":10,"values":[9,6,7,9,5,7,6,9,7]},{"type":"bar","alpha":0.5,"colour":"#CC9933","text":"Pageviews2","font-size":10,"values":[9,6,7,9,5,7,6,9,7]}]}Elements.bar柱状图表必须包含在元素数组type:string必须是’bar’alpha:number,0(透明)和1(不透明)之间的值colour
7、:string,CSS颜色text:string,图例说明文本font-size:number,设置图例文本字体大小values:arrayofnumber,柱子的高底例子:{"elements":[{"type":"bar","alpha":0.5,"colour":"#9933CC","text":"Pageviews","font-size":10,"values":[9,6,7,9,5,7,6,9,7]}]}Elements.pie圆饼图表,必须包含在元素数据组里type:string,必须是
8、’pie’start-angle:number,第一个切片角度colours:arrayofstring,CSS颜色alpha:number,0(透明)和1(不透明)之间的值stroke:number,切片外边线宽animate:boolean,切片图表动画values:arrayofobjects,每个切片值或者切片对象与值例子:{"elements":[{"type":"pie","start-angle":180,"colours":["#d01f