元旦から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 +  '歩'
            }
          }
        }]
      },
    }
  });

    


Post a Comment