世界地図表示 その2 (Visualization with Chart.js)

世界地図の表示に加えて、関連情報のグラフ表示を追加しました。 WHO公開情報を基にしています。 先の地図表示ページで、地図上の国指定からのリンクでこちらに遷移できます。 その他、このページ上で国を指定して、表示を変えることもできます。 実際の画面は、こちらへ

元データについて

  WHOのHPのなかのデータダウロードページで公開されている以下のデータを利用しています。 (A)Daily cases and deaths   (B)Latest reported counts of cases and deaths and transmission classificaton (C)Public Health Social Measures (D)Vaccination data 上記のうち、(1)には ISO Alpha-2、(3)(4)には、ISO-Alpa-3のCountry-codeがついていますが、(2)にはそれがないので、必要に応じて、Country-codeを追加する必要があります。

グラフ表示について

  Chart.jpを使って、折れ線グラフ、レーダーチャートを表示しました。   フラフ1:累積データの表示
Line nameWHO data nameFrom WHO CSV File
CumulativeCasesCases-comulative totalWHO-COVID-19 global data.csv
CumulativeDeathDeaths-Comulative total
NewCasesNew_cases
NewDeathsTOTAL_VACCINATRIED_PRE_100
VaccinatedPer100New_deathsVaccination-data.csv
    グラフ2:日々の新規発生数
Line nameWHO data nameFrom WHO CSV File
NewCasesNew_casesWHO-COVID-19 global data.csv
NewDeathsNew_deathsWHO-COVID-19 global data.csv
VaccinatedPer100TOTAL_VACCINATRIED_PRE_100Vaccination-data.csv
    グラフ3:規制情報(レーダーチャート)
vertex nameWHO data nameFrom WHO CSV File
masksMASKSphsm-severity-data .csv
travelTRAVEL
gatheringsGATHERINGS
schoolsSCHOOLS
businessesBUSINESSES
movementsMOVEMENT
(※内容はWHOのページで確認ください)  

表示内容変更

  表示内容は、以下の操作により対象国をかえて、切り替えることができます。 (1)世界地図表示ページに戻り、地図上での再選択 (2)本ページ上のリストボックスで、対象国を選択し、再表示ボタン(Redisplay selected country)をクリック    

実際の表示画面

 

まとめ

  これに先立つページで、世界地図を表示しそこからのリンクで、このページに遷移できるようにしています。 このページ単独でも、国を選択し、表示を変えることできますが、地図表示ページと合わせてご覧いただければと思います。 いずれは、このページから逆に地図上の選択ができるようなことも検討したいと思っています。

コメント

タイトルとURLをコピーしました