元旦から3カ月間の1日あたりのウォーキング歩数をプロットした
April 2, 2019 – 9:07 pm今年の元旦から3カ月間のウォーキング実績を描画用ツールChart.jsを用いてプロットしておいた。
なお、この図のうち、1月2日の歩数は実際には、29,314歩だったが、この日の歩数が突出しているので、便宜的に17000歩としてプロットしている。
描画するのに用いた HTMLと JavaScript を下記しておいた。
<canvas id="myBarChart"></canvas> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js"></script> <script type="text/javascript" src="/scripts/walking2019.js"></script>
walking2019.js:
var ctx = document.getElementById("myBarChart"); var myBarChart = new Chart(ctx, { type: 'bar', data: { labels: [ ,,,,'5日',,,,,'10日',,,,,'15日',,,,,'20日',,,,,'25日',,,,,'30日',,], datasets: [ { label: '1月 歩数 ', data: [17000, 17000, 1280, 12637, 13977, 13203, 13254, 11824, 16834, 9782, 12955, 13343, 12138, 15527, 13476, 12644, 3222, 12967, 13135, 13171, 12631, 11899, 11752, 13739, 12251, 2544, 10673, 13197, 12810, 13989, 12039 ], backgroundColor: "rgba(219,39,91,0.5)" }, { label: '2月 歩数 ', data: [ 2950, 14445, 13137, 14727, 12076, 5456, 14920, 12202, 3332, 12825, 2838, 12110, 12951, 14451, 13306, 2660, 13357, 14200, 13372, 11639, 12773, 4024, 9526, 12274, 12869, 11526, 12902, 4030,,, ], backgroundColor: "rgba(130,201,169,0.5)" }, { label: '3月 歩数 ', data: [11846, 13770, 13434, 5045, 12925, 1357, 2745, 15716, 13037, 11308, 2854, 11976, 13185, 13590, 12232, 12285, 1224, 13360, 13715, 3874, 2799, 2211, 2958, 1874, 3053, 8879, 13661, 12798, 12128, 15931, 11773 ], backgroundColor: "rgba(255,183,76,0.5)" } ] }, options: { title: { display: true, text: '月別 歩数' }, scales: { yAxes: [{ ticks: { suggestedMax: 15000, suggestedMin: 0, stepSize: 5000, callback: function(value, index, values){ return value + '歩' } } }] }, } });