概要
非公開のため、クライアント名は記載できません。
船舶のスケジュールで出発港から到着港までの風の強さや波の強さなどを表すグラフアプリケーションを作成したいとの事。
他の機能として、出発港から到着までの道のりをMapboxで選択したら、その緯度・経度のデータをJsonファイルとしてダウンロードできるようにしたい。
また航海の際に航海可能範囲と航海不可範囲を表した画像をダウンロードできるようにしたい。
その画像は社内ツールで使用するとのことでした。
実装
使用技術：Vue3／TypeScript ／Mapbox／Chart.js／Turf.js ／html2canvas
SPAで実装し、1つのアプリケーションに上記の機能を追加したアプリケーションを開発。
Mapboxで複数選択したライン上の緯度・経度の情報をJsonファイルとして作成してダウンロードする部分をVueで開発。
またクライアントから提供いただいた特殊なデータをバックエンドのPythonでJsonデータに変換。そのデータを利用して、フロント側のVueでChart.jsを利用したアプリケーションを開発。
ほか、Mapbox上でMapboxの選択ツールを使用して地図上で作成した航海可能範囲の中に航海不可の範囲を作成して重なった部分をTurf.jsを利用して切り抜き、html2canvasを使用して画像化、ダウンロードするように実装しました。
バックエンドはAWS Lamdaを利用したPyhonによるAPIやデータ変換の開発。
こちらはバックエンドエンジニアが担当しました。