続・Chart.jsで厚労省が提供しているデータを表示してみました。死亡者数編
こんにちは、@yasuです。
厚労省が提供しているデータ「死亡者数」を表示してみました。
https://ojagggyo.github.io/chart/sample_death.html
厚生労働省オープンデータ「死亡者数(累積)」
https://covid19.mhlw.go.jp/public/opendata/deaths_cumulative_daily.csv
提供されているデータは累計だったので、日ごとの数に加工した後に、チャートに使っています。
ソース
データ部分は外に出しました。
https://ojagggyo.github.io/chart/sample_death.js
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="./sample_death.js"></script>
<script>
const data = {
labels: labels,
datasets: [{
label: '死亡者数',
backgroundColor: 'rgb(221, 51, 204)',
borderColor: 'rgb(221, 51, 204)',
data: datas,
}]
};
// === include 'setup' then 'config' above ===
const config = {
type: 'bar',
data: data,
options: {}
};
</script>
</head>
<body>
<div>
<canvas id="myChart"></canvas>
</div>
<script>
var myChart = new Chart(
document.getElementById('myChart'),
config
);
</script>
</body>
</html>
参考記事
- Chart.js
https://www.chartjs.org/
Hi @yasu,
October Steemit Team Support 👇
10月中は、Steemitチームからサポートされることになりましたので、 #steemexclusive (Steemit限定記事)のタグを忘れずに!
長めの記事が良いそうです。
https://steemit.com/hive-161179/@japansteemit/steem-japan-community-update-9-29-2021-big-news
Post good contents and don't forget to use #steemexclusive tag
💡 Curation Guide 💡