??open-flash-chart是一个flash图形工具,主要通过JS设置参数来控制图形的显示,主要有线、柱状及饼图. 基本上能满足数据统计分析的图形化显示需求。
?????? 优点:使用方便,一般浏览器都能支持使用,提供回调功能支持更高级的处理。
目录下JS是与swf交互的核心脚本,不过有些地方好像写得不大好,有些语法不遵从W3C标准,呵~~
?????? 一点见解:个人觉得用ajax请求数据,然后在前台控制图形的显示比较好。比起在后台直接生成HTML代码返回直接打印的好,怎么说网络传输量可以减少些,而且用前者还可能做成类似单例的加载方式。所以个有觉得没必要用PHP或JAVA等其它语言从后台返回的HTML的方式(虽然OPEN-FLASH-CHART已经有支持的类),个人还是喜欢在前台用JS的方式来控制图形,哈哈~~~
百变不离其宗!
下面是我整理的一些文档,可以参考,应该是比较齐的了:??
坐标线状图、柱状图(参数用','进行分隔) (y2表示右边的纵坐标)
元素/属性 |
形状或作用 |
参数1 |
参数2 |
参数3 |
参数4 |
参数5 |
参数6 |
title |
显示图表主题(最上方) |
主题名称 |
样式style |
? |
? |
? |
? |
x_legend |
X坐标说明(最下方,与X轴平行) |
说明信息 |
字体大小 |
字体颜色 |
? |
? |
? |
y_legend |
Y坐标说明(最左边,与Y轴平行) |
说明信息 |
字体大小 |
字体颜色 |
? |
? |
? |
x_labels |
设置X轴坐标显示 |
? |
? |
? |
? |
? |
? |
y_label_size |
? |
? |
? |
? |
? |
? |
? |
x_label_style |
设置X轴样式 |
字体大小 |
字体颜色 |
角度(0:0度,1:90度,2:45度) |
设置X轴线条间隔 |
X轴间隔线条颜色 |
? |
y_label_style |
设置Y轴样式 |
字体大小 |
字体颜色 |
? |
? |
? |
? |
x_ticks |
控制X轴坐标标记显示 |
X轴坐标标记长度 |
? |
? |
? |
? |
? |
y_ticks |
控制Y轴坐标标记显示 |
Y轴坐标标记最小长度 |
Y轴坐标标记最大长度 |
将Y轴分割成几个段 |
? |
? |
? |
X_min |
设置X轴坐标最小值 |
X轴坐标最小值 |
? |
? |
? |
? |
? |
x_max |
设置X轴坐标最大值 |
X轴坐标最大值 |
? |
? |
? |
? |
? |
y_min |
设置Y轴坐标最小值 |
Y轴坐标最小值 |
? |
? |
? |
? |
? |
y_max |
设置Y轴坐标最大值 |
Y轴坐标最大值 |
? |
? |
? |
? |
? |
bg_colour |
设置背景颜色 |
? |
? |
? |
? |
? |
? |
inner_background |
设置坐标区域内部颜色 |
颜色1 |
颜色2(从颜色1渐变到颜色2) |
渐变角度 |
? |
? |
? |
bg_image |
设置背景图片 |
图片位置 |
? |
? |
? |
? |
? |
bg_image_x |
设置图片横向位置 |
[left |center |right] |
? |
? |
? |
? |
? |
bg_bg_image_y |
设置图片纵向位置 |
[top |middle |bottom] |
? |
? |
? |
? |
? |
x_axis_colour |
设置X轴颜色 |
? |
? |
? |
? |
? |
? |
y_axis_colour |
设置Y轴颜色 |
? |
? |
? |
? |
? |
? |
x_axis_steps |
设置X轴线条间隔 |
? |
? |
? |
? |
? |
? |
x_axis_3d |
设置X轴3d效果的高度 |
? |
? |
? |
? |
? |
? |
x_grid_colour |
设置X轴线条颜色 |
? |
? |
? |
? |
? |
? |
y_grid_colour |
设置Y轴线条颜色 |
? |
? |
? |
? |
? |
? |
show_y2 |
设置Y轴右边也显示坐标 |
[true |false] |
? |
? |
? |
? |
? |
y2_lines |
设置哪个图是根据右边Y坐标的值来显示 |
[可以有多个] |
? |
? |
? |
? |
? |
y_format |
格式化Y轴显示(常与#val#等联合使用) |
? |
? |
? |
? |
? |
? |
values |
设置值 |
? |
? |
? |
? |
? |
? |
num_decimals |
格式化小数位数 |
? |
? |
? |
? |
? |
? |
is_fixed_num_decimals_forced |
是否强制格式化小数 |
[true |false] |
? |
? |
? |
? |
? |
is_decimal_separator_comma |
是否使用小数分隔符 |
[true:, |false: . ](与千位分隔符相反) |
? |
? |
? |
? |
? |
is_thousand_separator_disabled |
是否使用千位分隔符 |
[true |false] |
? |
? |
? |
? |
? |
x_offset |
是否自动补偿以适应图的显示 |
[true |false] |
? |
? |
? |
? |
? |
bar |
柱状图 |
透明度 |
颜色 |
名称#key# |
名称字体大小 |
? |
? |
bar_glass |
水晶柱状图 |
透明度 |
内部颜色 |
外框颜色 |
名称#key# |
名称字体大小 |
? |
bar_fade |
渐变柱状图 |
透明度 |
颜色 |
名称#key# |
名称字体大小 |
? |
? |
bar_arrow |
带有箭头的柱状图 |
透明度 |
颜色 |
名称#key# |
名称字体大小 |
? |
? |
bar_3d |
3D立体柱状图 |