「Reactを使用して、エキサイティングなデータセットに対してインタラクティブなインターフェースを構築する」

Building interactive interfaces for exciting datasets using React

データチュートリアル

ウェブ開発を使用してよりダイナミックなデータ可視化体験を作成する

私の本業は小さな機械学習会社のCEOですが、趣味として美しいデータの可視化を作成しています。

通常はMatplotlibを使用していますが、今回はよりインタラクティブな体験を作成したいと思いました。

ウェブ開発とデザインが好きなので、World Bankの人口推計と予測データセットに対してReactアプリケーションを作成することにしました。

これは1960年から2022年までのすべての国と地域の人口ピラミッドを見ることができる興味深いデータセットであり、2050年までの予測も含まれています。Creative Commons Attribution 4.0のライセンスで提供されています。

• AccelDataがBewgleを買収：AIデータパイプラインの可視化における重要な動き
• 「データ注釈は機械学習の成功において不可欠な役割を果たす」
• 「2023-24年のアクセンチュアフェローにお会いください」

また、人々が簡単に年度や地域を変更できるインタラクティブなインタフェースに適したデータセットでもあります。

この記事では、私の作業から得られた知見と学んだことを共有します。

解決策をテストしたい場合は、こちらで見つけることができます：https://datawonder.io/population-pyramids

さあ、始めましょう。

パート1：データの準備

時間のかかる前処理を行わずに、データをフロントエンドに提供するシンプルで高速なバックエンドを作成したかったです。

代わりに、アプリケーションが開始されるときに、すべてのデータを事前に準備してメモリに読み込むことにしました。

World Bankのデータには常に一連の指標があり、私が必要とするものは次の形式を持っています：

人口 <年齢グループ>、<性別>

0〜4歳から80歳以上までの17の年齢グループがあります。各指標には、以下のpandasデータフレームのように、年ごとに別々の列があります。

必要なデータの部分を正確に知っていたので、フィルタリングやその他の操作を行わずに済むようにしました…

We will continue to update VoAGI; if you have any questions or suggestions, please contact us!