ofc 统计图的使用

很久以前用了 ofc ，觉得不错，分享一下

参数分析：

title	显示图表主题（最上方）	主题名称
x_legend	X坐标说明（最下方, 与X轴平行）	说明信息
y_legend	Y坐标说明（最左边, 与Y轴平行）	说明信息
x_labels	设置X轴坐标显示
y_label_size
x_label_style	设置X轴样式	字体大小
y_label_style	设置Y轴样式	字体大小
x_ticks	控制X轴坐标标记显示	X轴坐标标记长度
y_ticks	控制Y轴坐标标记显示	Y轴坐标标记最小长度
X_min	设置X轴坐标最小值	X轴坐标最小值
x_max	设置X轴坐标最大值	X轴坐标最大值
y_min	设置Y轴坐标最小值	Y轴坐标最小值
y_max	设置Y轴坐标最大值	Y轴坐标最大值
bg_colour	设置背景颜色
inner_background	设置坐标区域内部颜色	颜色1
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]

加载js 文件

<script type="text/javascript" src="public/ofc/js/swfobject.js"></script>

　　

在要显示的页面建立一个 框， 来实现显示图表的功能

<div  id='chart' style="display:none;">{$str}</div>

<div id="my_chart">

<script type="text/javascript">

var data = document.getElementById('chart').innerHTML;

swfobject.embedSWF(   //这是在调用 ofc 库

 

"public/ofc/open-flash-chart.swf", "my_chart", "550", "400", //引入文件初始化的swf文件 ， 设置大小,绑定位置

 

"9.0.0", "expressInstall.swf",  //确定使用的图表swf 文件

{

"data-file":'public/ofc/data.json'

//加载data.json 数据，该数据为json 格式 ，对数据类型要求严格, you控制器写入数据

}

);

</script>

</div>

在控制器php页面中为ofc 分配数据，完成图表功能

<?php

public function set(){

#实例化对象

$chart = new systemModel();

$res = $chart->getChart();

#写入json 文件

file_put_contents('Public/ofc/data.json', $res);

#载入模版

$this->smarty->display('admin/set.html');

}

?>

 

在模型中获取（生成）数据 

<?php

#进行三维图的使用

public function getChart(){

#加载 ofc 插件

require_once 'libs/php-ofc-library/open-flash-chart.php';

#设置标题

$title = new title( "商品库存" );

#设置基本样式

$title->set_style( "{font-size: 20px; font-weight: bold; color: #172229; text-align: center;}" );

#定义要显示的数据

$vals = array();

$x_labels = array();

 

#获取商品的数据

$goods = new GoodsMangModel();

#获取显示的商品

$goodsMsg = $goods->getgoodsChart();

foreach($goodsMsg as $key=> $val){

#定义数组数据

$x_labels[] = $val['brand_name'];

$vals[] = (int)$val['counts'];

}

 

 

$d = new hollow_dot();

$d->size(4)->halo_size(0)->colour('#3D5C56');

 

#创建折线对象

$line = new line();

#设置折线中点的样式

$line->set_default_dot_style($d);

#设置颜色

$line->set_colour('#3D5C56');

#设置值

$line->set_values( $vals );

$line->attach_to_right_y_axis();

 

#创建一个 ofc 对象

$chart = new open_flash_chart();

#设置改图表的标题

$chart->set_title( $title );

#为图表追加折线图

$chart->add_element( $line );

 

$arr = $vals ;

#创建柱状图对象

$bar1 = new bar_filled( '#BF3B69', '#577261' );

#对柱状图进行值设置

$bar1->set_values($vals);

$bar1->attach_to_right_y_axis();

#柱状图进行追加

$chart->add_element( $bar1 );

 

$y = new y_axis_right();

#设置y坐标

$y->set_range( 0, 200, 1 );

$y->set_stroke( 3 );

$y->set_colour( '#3D5C56' );

$y->set_tick_length( 16 );

#设置坐标的 步长

$y->set_steps( 20 );

 

$chart->set_y_axis_right( $y );

 

 

$x = new x_axis();

$x->set_labels_from_array($x_labels);

$chart->set_x_axis( $x );

#返回图表的数据信息 应该是json 格式

return $chart->toPrettyString();

}

代码写的不足之处，还望批评指正！