Skip to content

Open Data

This content is not available in your language yet.

e-Stat(政府統計の総合窓口)などのオープンデータをビルド時に取得してチャート表示します。

  • e-Stat API — 政府統計の総合窓口
  1. データ取得・JSON生成(ビルド時)

    astro.config.mjsopenDataIntegration に統計表ID・分類コードなどのパラメータを指定すると、ビルド時に EStatFetcher が e-Stat API からデータを取得し、src/data/opendata-astro/ 以下にJSONとして書き出します。APIキー(ESTAT_API_KEY)はビルド環境のみで使用し、クライアントには露出しません。

  2. データ整形(MDX内)

    各ページの .mdx 内で生成されたJSONを import し、必要に応じて変化率の算出やランキング抽出などの加工を行います。

  3. チャート表示

    整形したデータを opendata-astro<OpenDataChart> コンポーネントに渡して描画します。内部では Chart.jsreact-chartjs-2)を使用し、client:only="react" でクライアントサイドにレンダリングします。