生成饼状图,折线图,条形图通用的php类,这里使用的是百度 Echart。

Echart 官方网站  http://echarts.baidu.com/

<?php
class Echarts
{ /**
* 返回渲染图表Js代码
* @param $id dom元素id
* @param array $data 图表数据Data
* @param $type 图表类型 饼图: pie 条形图:bar 条形图: line
* @param string $mainTitle 主要标题
* @param string $subTitle 副标题
* @param string $yUnit y轴单位
*@param string $color 颜色 $color="['orange','green','pink']";
* @return string
*/
public static function getEcharts($id, array $data, $type, $mainTitle = '', $subTitle = '', $yUnit = '',$color="")
{
$xaxis = "";
$series = "";
if (empty($data)) {
$data = array(
'legend' => array(
'data' => array('-')
),
'xaxis' => array(
'type' => 'category',
'boundaryGap' => 'false',
'data' => array('')
),
'series' => array(
array(
'name' => '-',
'type' => 'line',
'itemStyle' => "{normal: {areaStyle: {type: 'default'}}}",
'data' => array()
),
)
);
}
foreach ($data as $key => $value) {
switch ($key) {
case 'legend':
$legend = '[';
foreach ($value as $k => $v) {
// data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
$legend = $legend . json_encode($v, JSON_UNESCAPED_UNICODE) . ','; }
$legend = $legend . ']';
break;
case 'xaxis':
foreach ($value as $k => $v) {
switch ($k) {
case 'type':
$xaxis[] = $k . ":'" . $v . "'";
break;
case 'boundaryGap':
$xaxis[] = $k . ':' . $v;
break;
case 'data':
$xaxis[] = $k . ':' . json_encode($v, JSON_UNESCAPED_UNICODE);
break;
}
}
$xaxis = '{' . implode(', ', $xaxis) . '}';
break;
case 'series':
foreach ($value as $list) {
$tmp = array();
foreach ($list as $k => $v) {
switch ($k) {
case 'name':
case 'radius':
case 'type':
$tmp[] = $k . ":'" . $v . "'";
break;
case 'center':
$tmp[] = $k . ":".$v;
break;
case 'itemStyle':
$tmp[] = $k . ':' . $v;
break;
case 'data':
$tmp[] = $k . ':' . json_encode($v, JSON_UNESCAPED_UNICODE);
}
}
$series[] = '{' . implode(', ', $tmp) . '}';
}
$series = implode(', ', $series);
break;
}
}
if ($type == 'pie') {
$xyAxis = '';
$tooltip="trigger: 'item',formatter: '{a} <br/>{b}:{c} ({d}%)'";
} else {
$xyAxis = 'xAxis :[' . $xaxis . '],';
$xyAxis = $xyAxis . "yAxis : [{type : 'value', axisLabel : {formatter: '{value}$yUnit'}}],";
$tooltip="trigger: 'axis'";
}
if($color!="")
{
$color='color:'.$color.',';
} $script = <<<EOT
// 路径配置
require.config({
paths: {
echarts: 'http://echarts.baidu.com/build/dist'
}
});
// 按需加载所需图表
require(
[
'echarts',
'echarts/chart/bar', //按需加载条形图
'echarts/chart/line', //按需加载折线图
'echarts/chart/funnel',
'echarts/chart/pie', //按需要加载饼图
'echarts/chart/gauge',
'echarts/chart/map',
],
function(ec) {
var myChart = ec.init(document.getElementById('$id'));
var option = {
$color
title : {
text:'$mainTitle',
subtext: '$subTitle',
x:'center'
},
tooltip : {
$tooltip
},
legend: {
orient: 'vertical',
x: 'left',
data: $legend
},
toolbox: {
show : false,
feature : {
mark : false,
dataView: { show: true, readOnly: false },
magicType:['line', 'bar','pie','gauge'],
restore : true
}
},
calculable : true,
$xyAxis
series : [$series]
};
myChart.setOption(option);
}
);
EOT;
return $script;
}
}

如何使用,php后台调用方法

  // 饼形图模拟数据
$optionPie = array(
"legend" => array("未参加活动", "参与活动未回答问卷", "参与活动并回答问卷"),
"series" => array(
array(
"name" =>"会员活动详情",
"type" =>"pie",
"radius"=>"50%",
"center"=>"['50%', '50%']",
"data" => $data, //这是一个二维数组
"itemStyle"=>"{normal:{label:{show:true,formatter:'{b}:{c}人 ({d}%)'}},labelLine :{label:{show:true}}}"),
),
);
$ec = new Echarts();
$result = $ec->getEcharts('pieArea', $optionPie, 'pie', '杜比广州上海活动2情况统计图'); // 显示在指定的dom节点上     //返回的是js脚本
return $result;

就这样调用就可以在前台显示统计图了。

对了在前台页面还要添加echarts引用,已经Jquery引用

<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>

php 生成饼状图,折线图,条形图 通用类的更多相关文章

  1. php 生成饼状图,折线图,条形图 通用类 2

    生成饼状图,折线图,条形图通用的php类,这里使用的是国外的 HighCharts,前台页面别忘了调用HighCahrt  js HighCharts中文网站  http://www.hcharts. ...

  2. JFreeChart框架中生成饼状图上怎样显示数据 [问题点数:40分,结帖人GreenLawn]

    我用JFreeChart框架生成饼状图,但想把数据信息在饼图上显示,是在饼图内部(即圆内)显示!怎样实现啊??  去掉lablepieplot.setLabelGenerator(null);去掉线p ...

  3. 【Excel】绘图案例_常见复合图:簇状图+堆积图+折线图

    前言 最近有朋友让我帮忙用excel画图,老实说我很讨厌用excel画图,点来点去,复杂一些还不能复用,非常繁琐.当然,入门也很简单.需求时不同城市.不同产品的2016和2017销量及环比数据,这应该 ...

  4. Python的可视化包 – Matplotlib 2D图表(点图和线图,.柱状或饼状类型的图),3D图表(曲面图,散点图和柱状图)

    Python的可视化包 – Matplotlib Matplotlib是Python中最常用的可视化工具之一,可以非常方便地创建海量类型地2D图表和一些基本的3D图表.Matplotlib最早是为了可 ...

  5. highcharts 动态生成x轴和折线图

    highchart 动态生成x轴和折线图 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8&qu ...

  6. Echarts生成饼状图、条形图以及线形图 JS封装

    1.在我们开发程序中,经常会用到生成一些报表,比方说饼状图,条形图,折线图等.不多说了,直接上封装好的代码,如下Echarts.js所示 以下代码是封装在Echarts.js文件中 /** * Cre ...

  7. PHP实现动态生成饼状图、柱状图和折线图(转载)

    PHP在图像操作方面的表现非常出色,我们只需借助可以免费得到的GD库便可以轻松实现图.表勾画.下面将分别介绍PHP实现的饼状图.折线图和柱状图以 及他们的使用方法,这几段代码的特点就是不需要再把它们复 ...

  8. PHP实现动态生成饼状图 (转载)

    <?php //变量定义,画椭圆弧时的角度大小 define("ANGLELENGTH", 10); /** * 绘制图片 * @param $title 3D图的标题 * ...

  9. 使用WinForm Chart控件 制作饼装,柱状,折线图

    http://blog.csdn.net/dream2050csdn/article/details/53510340 chart控件的属性很多,主要用到Chart控件图表区域的属性有五个属性 1.A ...

随机推荐

  1. XMLHttp.send()不传参时必须传null吗?

    xmlhttp的send是传递参数用的,但是只有在使用post方式提交请求的时候才有用如下:xmlhttp.open("post",url,true); ...xmlhttp.se ...

  2. jQuery制作信息提示弹出层插件【推荐】

    给大家分享一款非常实用的弹窗提示窗口插件,包含多种模式.带有回执函数值的功能.​1. [代码][JavaScript]代码 <script type="text/javascript& ...

  3. SPOJ:Help BTW(二分)

    BTW wants to buy a gift for her BF and plans to buy an integer array. Generally Integer arrays are c ...

  4. MongoDB复制集安全认证

    之前我有一篇博客写的是“node.js通过权限验证连接MongoDB”,这篇博客上提到如何在启动文件中通过配置auth参数来开启权限认证,但这种认证方式只适合单机节点,当我们使用复制集时应该怎么开启权 ...

  5. 洛谷P1113杂物——DP

    题目:https://www.luogu.org/problemnew/show/P1113 每个任务的时间就是准备工作中完成最晚的那个的时间再加上自己的时间. 代码如下: #include<i ...

  6. CKD 实现

    主要功能: 1.新物料(部品号)的入库管理 部品号的验证.描述.品名.重量.单价等 2.部品号-供应商的核对 校验部品号/供应商的对应情况.入库.移除等 3.BOM清单的导入 基础清单的导入 4.订单 ...

  7. 【转】 IntelliJ IDEA 中 Project 和 Module 的概念及区别

    原文地址:https://blog.csdn.net/qq_35246620/article/details/65448689 在 IntelliJ IDEA 中,没有类似于 Eclipse 工作空间 ...

  8. Android菜单代码

    前言: 学习android断断续续也有一年半左右,但一直在学习,很少回顾以往的知识.所以我打算用业余时间来写一些这样总结性的文章,希望温故知新. 以下只是我个人的一些感悟和见解(当然会查证资料验证), ...

  9. UVa 1644 Prime Gap (水题,暴力)

    题意:给定一个数 n,求它后一个素数和前一个素数差. 析:先打表,再二分查找. 代码如下: #pragma comment(linker, "/STACK:1024000000,102400 ...

  10. (水题)Codeforces - 327C - Magic Five

    https://codeforces.com/problemset/problem/327/C 因为答案可以有前导零,所以0和5一视同仁.每个小节内,以排在第 $i$ 个的5为结尾的序列即为在前面 $ ...