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

 生成饼状图,折线图,条形图通用的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>

原文地址:https://www.cnblogs.com/luoyangcn/p/4712544.html