🛩️

FrightRadar24みたいな奴を3Dで作る！

2023/08/13に公開

はじめに

FrightRadar24みたいにリアルタイムで世界中の飛行機の位置を3Dグラフィックで表示させたら面白いんじゃないかと思ったので、作ります！
作り方を事細かに解説、というよりは何を考えて作ったか記録しておくみたいな方向です

とりあえず作るにあたって必要そうな技術と環境を考えてみます。

Webアプリケーションであることは決定しているので、Next.js　を使います。
web上で３ｄを扱うライブラリとしてReact-three-fibeを使います。
最後は飛んでいる飛行機の情報を取得するapiを探します。
ところが、リアルタイムに飛んでいる飛行機の位置だったりを返すapiは軒並み有料だったり、フリーのプランでは1日に呼び出せるapiの回数制限があったりと、良いものが見つかりませんでした。
そこで、飛行機の位置情報ではなくフライトの時刻表から出発地と到着地そしてフライトにかかる時間を取得し、２点間で飛行機を動かすことでリアルタイムっぽい動きを再現する事にしました。
公共交通オープンデータセンターで必要なapiを見つけたので登録します。
全日空と日本航空のデータ取得できる様です。