PHP后端需将数据库查询结果按ECharts要求拼接为xAxis.data和series.data结构:先按时间升序查询并保证顺序,再用array_column或手动循环提取categories和values,多系列时需补0对齐长度,最后json_encode输出。

用PHP框架后端拼接ECharts所需的数据结构,核心是把数据库查询结果转换成ECharts能直接渲染的series.data或category轴格式,避免前端JavaScript手动处理原始数据。
准备基础数据结构
从数据库查出带时间戳和数值的原始记录,例如销售流水表:SELECT DATE(created_at) as day, SUM(amount) as total FROM orders WHERE created_at >= '2024-01-01' GROUP BY day ORDER BY day;这一步必须按时间升序排列,否则折线图X轴会错乱。
将查询结果存入PHP数组,键名不重要,但需保证顺序与SQL ORDER BY一致——ECharts的xAxis.data和series.data靠索引位置严格对齐。
拼接柱状图/折线图基础数据
方法一:手动构造二维数组
立即学习“PHP免费学习笔记(深入)”;
初始化两个空数组:$categories = [] 和 $values = [];遍历PDOStatement结果集,每次循环中 $categories[] = $row['day']; $values[] = (float)$row['total']; 最后组合成ECharts要求的格式:['xAxis' => ['data' => $categories], 'series' => [['data' => $values]]]。
方法二:用array_column一次提取(PHP 7.3+)
执行 $rows = $stmt->fetchAll(PDO::FETCH_ASSOC); 然后 $categories = array_column($rows, 'day'); $values = array_column($rows, 'total'); 注意【array_column不会自动转为float,若数据库字段是DECIMAL,必须用array_map('floatval', $values)显式转换】,否则ECharts渲染时可能报NaN。
拼接带多系列的折线图
第一步:确定分组维度,比如按产品类别统计日销量
SQL需改写为 SELECT DATE(created_at) as day, category, SUM(amount) as total FROM orders GROUP BY day, category ORDER BY day, category;注意ORDER BY必须先day后category,才能用PHP按天切片。
第二步:用双重循环重组数据
先用array_reduce按day归组,再遍历每个category生成独立series项;关键点在于确保所有series的data数组长度相同——缺失某天数据时要补0,否则线条会断开。例如某天没有“手机”类订单,对应位置必须填0而不是跳过。
第三步:构造最终JSON结构
返回给前端的数组必须包含xAxis.data(唯一日期列表)和多个series项,每个series有name和data,且data长度等于xAxis.data长度;用json_encode($chartData, JSON_UNESCAPED_UNICODE | JSON_NUMERIC_CHECK)输出,避免中文乱码和数字被转成字符串。



















