お知らせ

ただいま、シンタックスハイライターの設定を見直しております。
プログラムが見にくくなっているページがありますが、ご容赦ください。

棒グラフをプログラムで描いてみる

グラフ

こんにちは。前回、2020年からの小学校での統計の扱いについて、学習指導要領解説をもとにまとめました。

何回かに分けて学習指導要領解説に登場したグラフを描いていくことにします。

今回は『棒グラフ』!といっても、みんな知ってる棒グラフです。といっても、単に書くだけではしょぼすぎるので、プログラムで描いていきます。

小学校の算数で、下に書いたプログラミングはしなくてよいと思っています。

Python + matplotlib で描く棒グラフ

はじめは Python + Matplotlib で描きます。

import matplotlib.pyplot

left = [ 1, 2, 3, 4, 5 ]
height = [ 5, 9, 7, 8, 6 ]
labels = [ 'ぞう', 'パンダ', 'きりん', 'ライオン', 'その他' ]

matplotlib.pyplot.title( 'すきなどうぶつ' )
matplotlib.pyplot.bar( left, height,
                       width = 0.6, linewidth = 2,
                       tick_label = labels )
matplotlib.pyplot.xlim( 0.5, 5.5 )
# matplotlib.pyplot.ylim( 4, 10 )
matplotlib.pyplot.show()

12行目にコメントアウトしている行が実行されるようにすると、悪名高い足切り棒グラフになります。

Python + matplotlib で描いた棒グラフ

Python + seaborn + matplotlib で描く棒グラフ

次に、Python + seaborn + matplotlibで描きます。

import seaborn as sns
import pandas
import matplotlib.pyplot

y = [ 5, 9, 7, 8, 6 ]
x = [ 'ぞう', 'パンダ', 'きりん', 'ライオン', 'その他' ]
count = pandas.DataFrame( { '動物' : x, '人数' : y } )

ax = sns.barplot( x='動物', y='人数', data=count )
ax.set_title('すきなどうぶつ')
matplotlib.pyplot.show()
Python + seaborn + matplotlib で描いた棒グラフ

R で描く棒グラフ

次に、Rで描きます。

y = c( 5, 9, 7, 8, 6 )
x = c( "ぞう", "パンダ", "きりん", "ライオン", "その他" )
color = c( "red", "blue", "yellow", "green", "purple" )
barplot( y, names.arg = x,col= color, main = "すきなどうぶつ", xlab = "どうぶつ", ylab = "人数", ylim = c(0,10))
box( lty = 1 )
R で描いた棒グラフ

Chart.js で描く棒グラフ

次に、Chart.jsを使って描きます。棒にマウスカーソルを合わせると、棒の色が変わるとともに値を表示してくれます。

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8">
    <title>すきなどうぶつ</title>
  </head>
  <body>
    <canvas id="stage"></canvas>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js"></script>
    <script>
      var mydata = {
      labels: [ "ぞう", "パンダ", "きりん", "ライオン", "その他" ],
      datasets: [
        {
          label: '人数',
          hoverBackgroundColor: "rgba(255,99,132,0.3)",
          data: [ 5, 9, 7, 8, 6 ],
        }
      ] };

      var options = {
        title: {    
          display: true,
          text: 'すきなどうぶつ'
        },
        scales: {
          yAxes: [{
            ticks: {
              suggestedMax: 10,
              suggestedMin: 0,
              stepSize: 1,
              callback: function(value, index, values){
                return  value +  '人'
              }
            }
          }]
        },
      };

      var canvas = document.getElementById('stage');
      var chart = new Chart(canvas, {
        type: 'bar',
        data: mydata,
        options: options
      });
    </script>
    <noscript>JavaScriptが利用できません。</noscript>
  </body>
</html>
Chart.js で描いた棒グラフ

今回はこれでおしまいにします。それでは、また。

この記事を書いた人
春日井 優

高校で情報科という教科を担当しています。以前は数学科も担当していました。(今でも数学科の教員免許状は有効です。)プログラムを覚えたのは、「ゲームセンターあらし」という漫画のキャラクターがBASICを解説する「こんにちはマイコン」を読んだことがきっかけでした。

Posted by kasugai