4493QZ - Online PHP Interpreter & Debugging Tool

<!DOCTYPE html>
<html lang="th">
<head>
  <meta charset="UTF-8">
  <title>เปรียบเทียบค่า PM2.5 ปี 67-68</title>
  <script src="https://c...content-available-to-author-only...r.net/npm/chart.js"></script>
</head>
<body>
  <h2>เปรียบเทียบค่า PM2.5 ระหว่างปี 2567 กับ 2568</h2>
  <canvas id="pm25Chart" width="800" height="400"></canvas>

  <script>
    const data2567 = [35, 50, 28, 45, 60, 55, 70, 65, 40, 30, 25, 20]; // ตัวอย่างข้อมูล
    const data2568 = [30, 48, 25, 40, 55, 52, 68, 60, 38, 28, 20, 18]; // ตัวอย่างข้อมูล

    const ctx = document.getElementById('pm25Chart').getContext('2d');
    new Chart(ctx, {
      type: 'line',
      data: {
        labels: ['ม.ค.', 'ก.พ.', 'มี.ค.', 'เม.ย.', 'พ.ค.', 'มิ.ย.', 'ก.ค.', 'ส.ค.', 'ก.ย.', 'ต.ค.', 'พ.ย.', 'ธ.ค.'],
        datasets: [
          {
            label: 'ปี 2567',
            data: data2567,
            borderColor: 'rgba(255, 99, 132, 1)',
            fill: false,
          },
          {
            label: 'ปี 2568',
            data: data2568,
            borderColor: 'rgba(54, 162, 235, 1)',
            fill: false,
          }
        ]
      },
    });
  </script>
</body>
</html>