如何将MySQL数据转换为适配Google Line Chart多折线图的JSON数组

你的问题核心是MySQL存储的长表结构和Google Line Chart要求的宽表结构不匹配，按以下步骤修改即可实现多折线图数据自动生成：

步骤1：查询MySQL原始数据 #

首先按照时间、单位排序查询所有业务数据，示例用PDO连接，可替换为你当前在用的数据库连接逻辑：

// 数据库连接配置请替换为你自己的参数
$pdo = new PDO('mysql:host=你的数据库主机;dbname=你的库名;charset=utf8', '数据库用户名', '数据库密码');
$sql = "SELECT units, utilization, usedtime FROM 你的业务表名 ORDER BY usedtime ASC, units ASC";
$stmt = $pdo->query($sql);
$rawData = $stmt->fetchAll(PDO::FETCH_ASSOC);

步骤2：PHP侧聚合为Google Chart要求的格式 #

对查询到的长表数据按时间维度聚合，转换为「一个时间点对应所有单位利用率」的宽表格式：

// 初始化图表数据，第一行为表头
$chartData = [
    ['Time', '0', '1', '2', '3', '4', '5', '6', '7']
];

// 临时数组按时间聚合数据
$timeGroup = [];
foreach ($rawData as $item) {
    $time = $item['usedtime'];
    $unitIndex = (int)$item['units'];
    $utilValue = (int)$item['utilization']; // 必须转换为数字类型，否则图表无法识别
    
    // 首次遇到该时间点时初始化8个单位的默认值为0
    if (!isset($timeGroup[$time])) {
        $timeGroup[$time] = array_fill(0, 8, 0);
    }
    // 给对应单位的位置赋值
    $timeGroup[$time][$unitIndex] = $utilValue;
}

// 把聚合后的数据填充到图表数组
foreach ($timeGroup as $time => $unitValues) {
    $chartData[] = array_merge([$time], $unitValues);
}

// 转换为JSON格式供前端调用
$chartJson = json_encode($chartData);

步骤3：前端替换手动测试数据 #

把原来手动写的测试数组替换为PHP输出的JSON数据即可，其余图表配置无需修改：

function drawChart() {
    // 替换原手动数组为PHP输出的JSON
    var data = google.visualization.arrayToDataTable(<?php echo $chartJson; ?>);

    // 以下配置保持你原有的逻辑不变即可
    var options = {
        title: 'Units',
        curveType: 'function',
        legend: {
            position: 'bottom',
            colors: ['#0cae04', 'blue', 'red', 'green', '#4f9ee0', 'gray', 'navy', '#d3362d']
        }
    };
    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
}

可选优化 #

如果你的单位（units）取值不是固定的0-7，可以先从数据库查询所有单位的取值动态生成表头，无需写死。

内容的提问来源于stack exchange，提问作者RJP