php原生态与百度echarts联合制作数据图表

最新推荐文章于 2024-07-13 15:08:27 发布

SHUIPING_YANG

最新推荐文章于 2024-07-13 15:08:27 发布

阅读量1.2k

点赞数

分类专栏： mysql php echarts 文章标签： php 数据库

本文链接：https://blog.csdn.net/zhezhebie/article/details/56494373

版权

php 同时被 3 个专栏收录

283 篇文章 2 订阅

订阅专栏

mysql

64 篇文章 4 订阅

订阅专栏

echarts

1 篇文章 1 订阅

订阅专栏

php原生态与百度echarts联合制作饼状图：

需要的文件如下：
1、switch.php 这个是转换文件，也是主要的显示区域；
2、connect.php 这个是数据库连接文件；

以下是switch.php文件:

<?php 
session_start();
// 把表名文件名保存到session，带到文件导出页面备用
$_SESSION['titlesql']='ip';
$_SESSION['contentsql']=$sql;
$_SESSION['fileName']=$commit;

// 引入数据库链接文件
include_once 'connect.php';
//获取上一个页面，选择要查询的字段
$page=$_POST['page']?$_POST['page']:$_GET['page'];
//默认展示5条数据
$num=$_POST['num']?$_POST['num']:5;
$commit=$_GET['commit']?$_GET['commit']:$_POST['commit'];

// 执行SQL语句查询数据，取别名分别为name和value，这个是echarts里面的指定数据名称
$sql='select '.$page.' name,count(id) value from ip group by name order by value desc limit '.$num;

// 执行查询语句，返回对象
$rest=$pdo->query($sql);
// 获取数据
$rows=$rest->fetchAll();

// 取出数组中name这一列的值，作为echarts的饼名字
$ip=json_encode(array_column($rows, 'name'));       //名字
$ips=json_encode($rows) ;       //名字和值

?>
<!DOCTYPE html>
<html>

<head>
    <!-- ECharts单文件引入 -->
    <script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
            <div id="main"></div>
            <div class="choose">
                <form class="form-horizontal" action="switch.php" method="post" role="form">
                    <div class="form-group">
                            <label for="inputEmail3" class="col-sm-2 control-label">显示项数：</label>
                            <input type="text" class="form-control" name="num" id="inputEmail3" placeholder="默认前五">
                            <input type="hidden" name="page" value="<?php echo $page ?>">
                            <input type="hidden" name="commit" value="<?php echo $commit ?>">
                            <input type="submit" value="提交">
                    </div>
                    <div class="form-group">
                            <a href="func/excel.class.php" class="btn">导出excel文件</a>
                    </div>
                </form>
            </div>
</body>
<script type="text/javascript">
        // 基于准备好的dom，初始化echarts图表
        var myChart = ec.init(document.getElementById('main'));

        option = {
            title: {
                text: '<?php echo $commit ?>',
                subtext: '阳水平测试',
                x: 'center'
            },
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: '0%',
                y: '10%',
                data: <?php echo $ip ?>
            },
            toolbox: {
                show: true,
                feature: {
                    dataView: {
                        show: true,
                        readOnly: false
                    },
                    saveAsImage: {
                        show: true
                    }
                }
            },
            calculable: true,
            series: [{
                name: '访问来源',
                type: 'pie',
                radius: '55%',
                center: ['65%', '60%'],
                data:<?php echo $ips; ?>
            }]
        };


        // 为echarts对象加载数据 
        myChart.setOption(option);
</script>

</html>

以下是connect.php文件：

<?php 
try{
        $pdo=new PDO('mysql:host=localhost;dbname=dh_access','root','123456');
}catch(PDOException $e){
        die($e->getMessage());
}
    // 连接数据库，设置字符集
$pdo->exec('set names utf8');

    // 设置获取数据格式，之后取数据都按照索引数组取值
$pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE, PDO::FETCH_ASSOC); 
    // echo "数据库连接成功";