生成柱狀圖所需的頻率數據數組

M66 2025-06-07

array_count_values()是一個內置的PHP 函數，它接受一個數組作為參數，返回一個新數組，其中鍵是數組中出現的唯一元素，值是該元素在原數組中出現的次數。函數的語法如下：

 array_count_values(array $array): array

這個函數的返回值是一個關聯數組，其中每個元素的鍵是原始數組的值，值是該值在數組中出現的次數。

2. 示例：使用array_count_values()生成頻率數據

假設我們有一個包含某網站訪問日誌的用戶ID 數組，我們希望統計每個用戶的訪問次數並為其生成柱狀圖所需的頻率數據數組。以下是一個示例：

 <?php
// 假設這是我們從網站日誌中獲取的用戶訪問數據
$userVisits = ['user1', 'user2', 'user3', 'user1', 'user4', 'user1', 'user2'];

// 使用 array_count_values 函數來獲取每個用戶的訪問次數
$visitCounts = array_count_values($userVisits);

// 打印頻率數據數組
print_r($visitCounts);
?>

在上面的代碼中， array_count_values()函數將統計每個用戶在$userVisits數組中出現的次數。輸出將類似於：

 Array
(
    [user1] => 3
    [user2] => 2
    [user3] => 1
    [user4] => 1
)

3. 生成柱狀圖所需的頻率數據

根據上面的示例，我們已經得到了每個用戶的訪問頻率數據。接下來，我們可以將這些數據格式化為適合繪製柱狀圖的數據格式。通常，柱狀圖的數據格式是一個數組，其中鍵是類別（在本例中為用戶），值是該類別的頻率（即訪問次數）。

例如，我們可以使用以下代碼將頻率數據轉換為繪製柱狀圖所需的格式：

 <?php
// 假設我們已經得到了頻率數據數組 $visitCounts
$visitCounts = array_count_values($userVisits);

// 轉換為柱狀圖所需的數據格式
$barChartData = [];
foreach ($visitCounts as $user => $count) {
    $barChartData[] = [
        'label' => $user,
        'value' => $count
    ];
}

// 打印柱狀圖數據
print_r($barChartData);
?>

輸出結果將是一個數組，包含每個用戶和其訪問次數的鍵值對，適合用於生成柱狀圖：

 Array
(
    [0] => Array
        (
            [label] => user1
            [value] => 3
        )
    [1] => Array
        (
            [label] => user2
            [value] => 2
        )
    [2] => Array
        (
            [label] => user3
            [value] => 1
        )
    [3] => Array
        (
            [label] => user4
            [value] => 1
        )
)

4. 使用柱狀圖庫繪製柱狀圖

現在我們已經得到了一個適合繪製柱狀圖的頻率數據數組。接下來，我們可以使用一些流行的JavaScript 庫（如Chart.js）來生成柱狀圖。你可以將上面的數據傳遞到前端JavaScript 代碼中，利用這些庫繪製柱狀圖。

例如，使用Chart.js 可以如下實現：

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>柱狀圖示例</title>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
    <canvas id="barChart"></canvas>
    <script>
        var ctx = document.getElementById('barChart').getContext('2d');
        var barChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ['user1', 'user2', 'user3', 'user4'],
                datasets: [{
                    label: '訪問次數',
                    data: [3, 2, 1, 1],
                    backgroundColor: ['#FF5733', '#33FF57', '#3357FF', '#F0F33F'],
                    borderColor: ['#FF5733', '#33FF57', '#3357FF', '#F0F33F'],
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
    </script>
</body>
</html>

這個HTML 文件會展示一個柱狀圖，其中的標籤和數據分別來自PHP 生成的頻率數組。

array_count_values