万博の来場者数と5月23日以降の予測をバイブコーディングで作ってみました

2025.05.31

Logging

おはようございます.万博の来場者数と5月23日以降の予測をバイブコーディングで作ってみましたのでコードをシェアします.大阪万博の来場者数はYahooニュースの記事のデータを元にしています、其処から今後の予測を立ててもらいました.

https://zip358.com/tool/EXPO2025-OSAKA-KANSAI-JAPAN

因みに予測は簡易的なものなので、恐らく大きくハズレるとは思いますがそれなりの表が生成されるのが凄いなと思います.生成AIはOpenAIの無料枠を使用してデータと次のデータを元に10月13日までの予測を出力してという指示とJavaScriptやCSSを使用してグラフ化してという指示を出しただけで、コードを書いてくれます.

    const labels = [];
    const allVisitors = [];
    const generalVisitors = [];
    const staffVisitors = [];

    const rawData = [
      ["4/13", 146426, 22000], ["4/14", 70488, 17000], ["4/15", 63719, 16000], ["4/16", 73869, 15000],
      ["4/17", 82692, 15000], ["4/18", 93908, 15000], ["4/19", 108773, 15000], ["4/20", 95524, 16142],
      ["4/21", 99638, 17352], ["4/22", 103729, 17099], ["4/23", 99140, 17795], ["4/24", 108888, 17376],
      ["4/25", 110759, 17591], ["4/26", 122102, 17299], ["4/27", 102015, 16985], ["4/28", 121282, 17465],
      ["4/29", 97559, 17813], ["4/30", 101397, 17621], ["5/1", 105945, 17548], ["5/2", 104805, 17741],
      ["5/3", 120696, 17886], ["5/4", 136805, 16289], ["5/5", 126371, 16804], ["5/6", 76517, 16935],
      ["5/7", 91688, 16932], ["5/8", 105449, 18578], ["5/9", 105782, 19813], ["5/10", 128918, 21373],
      ["5/11", 121667, 18268], ["5/12", 117658, 17856], ["5/13", 123640, 18087], ["5/14", 129527, 17668],
      ["5/15", 129456, 17762], ["5/16", 132817, 17700], ["5/17", 123974, 16464], ["5/18", 117000, 16000],
      ["5/19", 129000, 17000], ["5/20", 125000, 18000], ["5/21", 129000, 19000], ["5/22", 134000, 18000],
      ["5/23", 157000, 18000]
    ];

    rawData.forEach(([date, total, staff]) => {
      labels.push(date);
      allVisitors.push(total);
      staffVisitors.push(staff);
      generalVisitors.push(total - staff);
    });

    const futureDays = 143;
    for (let i = 1; i <= futureDays; i++) {
      const futureDate = new Date(2025, 4, 13 + i); // 4月13日からスタート
      const label = `${futureDate.getMonth() + 1}/${futureDate.getDate()}`;
      labels.push(label);

      // 予測ロジック: 最近5日間の平均にランダムなゆらぎを加える
      const recentGeneral = generalVisitors.slice(-5);
      const avgGeneral = recentGeneral.reduce((a, b) => a + b, 0) / recentGeneral.length;
      const fluctuation = Math.sin(i / 5) * 5000 + (Math.random() - 0.5) * 8000;
      const predictedGeneral = Math.round(avgGeneral + fluctuation);

      const predictedStaff = 18000 + Math.round(Math.sin(i / 7) * 1000);
      const predictedTotal = predictedGeneral + predictedStaff;

      generalVisitors.push(predictedGeneral);
      staffVisitors.push(predictedStaff);
      allVisitors.push(predictedTotal);
    }

    const ctx = document.getElementById('visitorChart').getContext('2d');
    const chart = new Chart(ctx, {
      type: 'line',
      data: {
        labels: labels,
        datasets: [
          {
            label: '来場者数(合計)',
            data: allVisitors,
            borderColor: 'rgba(75, 192, 192, 1)',
            backgroundColor: 'rgba(75, 192, 192, 0.1)',
            borderWidth: 2,
            tension: 0.3,
            fill: true
          },
          {
            label: '一般来場者数',
            data: generalVisitors,
            borderColor: 'rgba(255, 159, 64, 1)',
            backgroundColor: 'rgba(255, 159, 64, 0.1)',
            borderWidth: 2,
            tension: 0.4,
            fill: true
          },
          {
            label: '関係者数',
            data: staffVisitors,
            borderColor: 'rgba(153, 102, 255, 1)',
            backgroundColor: 'rgba(153, 102, 255, 0.1)',
            borderWidth: 2,
            tension: 0.4,
            fill: true
          }
        ]
      },
      options: {
        animation: {
          duration: 1500,
          easing: 'easeInOutQuart'
        },
        responsive: true,
        scales: {
          y: {
            title: {
              display: true,
              text: '人数'
            }
          },
          x: {
            title: {
              display: true,
              text: '日付'
            },
            ticks: {
              maxRotation: 90,
              minRotation: 45,
              maxTicksLimit: 50
            }
          }
        },
        plugins: {
          legend: {
            position: 'top',
          },
          title: {
            display: false
          }
        }
      }
    });

これは脅威だなって思う人もいると思いますが、自分は便利だなって思う方です.今後、数年でエンジニア職を奪われかねないという懸念もありますが、コード書きは無くならないじゃないかなって思う方です.理由は修正しないといけない事が必ず起きる事.動作はするが予期しない動作が発生した場合、素人には対応できないため.

未来は人が描いている斜め上の未来になる事が多く、どう転ぶかは「神のみぞ知る」だと思います.なのであまり脅威に思わずそうなった時に対応するというスタンスで良いのかなと.

明日へ続く

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです.

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます.たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅.
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

タグ

```, エンジニア職, スタンス, バイブコーディング, ミゾ, ランダム, 万博, 予測, 予測ロジック, 人数, 其処, 動作, 大阪万博, 懸念, 指示, 日付, 月日, 月日以降, 生成, 脅威,