2017年7月26日水曜日

学習環境

Head First Statistics (Dawn Griffiths (著)、黒川 利明 (翻訳)、木下 哲也 (翻訳)、黒川 洋 (翻訳)、黒川 めぐみ (翻訳)、オライリージャパン)の3章(ばらつきと広がりを測る)、エクササイズ(p. 87)を取り組んでみる。

エクササイズ(p. 87)

  • 算術平均。

    8+18+30+22+12 1+2+3+2+1 = 90 9 =10

    下限8、上限12、範囲12 - 8 = 4。

    Python 3

    #!/usr/bin/env python3
    # -*- coding: utf-8 -*-
    
    import matplotlib
    import matplotlib.pyplot as plt
    
    matplotlib.rcParams['font.family'] = 'AppleGothic'
    
    
    def create_bar_char(data, labels, name):
        num_bars = len(data)
        positions = range(1, num_bars + 1)
        plt.barh(positions, data, align='center')
        plt.yticks(positions, labels)
        plt.xlabel('度数')
        plt.ylabel('得点')
        plt.grid()
        plt.savefig(name)
    
    if __name__ == '__main__':
        data = [1, 2, 3, 2, 1]
        labels = [8, 9, 10, 11, 12]
        create_bar_char(data, labels, 'sample1.svg')
        print(
            f'算術平均: {sum([x * y for x, y in zip(data, labels)]) / sum(data)}')
        print(f'上限: {max(labels)}')
        print(f'下限: {min(labels)}')
        print(f'範囲: {max(labels) - min(labels)}')
    

    入出力結果(Terminal, IPython)

    $ ./sample1.py
    算術平均: 10.0
    上限: 12
    下限: 8
    範囲: 4
    $
    
  • 算術平均。

    8+80+12 1+8+1 = 100 10 =10

    下限8、上限12、範囲12 - 8 = 4。

    HTML5

    <div id="graph0"></div>
    <pre id="output0"></pre>
    
    <button id="draw0">draw</button>
    <button id="clear0">clear</button>
    
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.2.6/d3.min.js" integrity="sha256-5idA201uSwHAROtCops7codXJ0vja+6wbBrZdQ6ETQc=" crossorigin="anonymous"></script>
    
    <script src="sample1.js"></script>    
    

    JavaScript

    let div0 = document.querySelector('#graph0'),
        pre0 = document.querySelector('#output0'),
        width = 600,
        height = 600,
        padding = 50,
        barPadding = 5,
        btn0 = document.querySelector('#draw0'),
        btn1 = document.querySelector('#clear0'),
        p = (x) => pre0.textContent += x + '\n',
        range = (start, end, step=1) => {
            let res = [];
            for (let i = start; i < end; i += step) {
                res.push(i);
            }
            return res;
        };
    
    let dataset = [];
    
    dataset[0] = 1;
    dataset[1] = 0;
    dataset[2] = 8;
    dataset[3] = 0;
    dataset[4] = 1;
        
    let draw = () => {
        pre0.textContent = '';
    
        let xscale = d3.scaleLinear()
            .domain([7.5, 12.5])
            .range([padding, width - padding]);
        let yscale = d3.scaleLinear()
            .domain([0, 8])
            .range([height - padding, padding]);
    
        let xaxis = d3.axisBottom().scale(xscale);
        let yaxis = d3.axisLeft().scale(yscale);
        div0.innerHTML = '';
        let svg = d3.select('#graph0')
            .append('svg')
            .attr('width', width)
            .attr('height', height);
    
        svg.selectAll('rect')
            .data(dataset)
            .enter()
            .append('rect')
            .attr('x', (d, i) => xscale(i + 7.5))
            .attr('y', (d) => yscale(d))
            .attr('width', (width - 2 * padding) / dataset.length - barPadding)
            .attr('height', (d) => yscale(0) - yscale(d))
            .attr('fill', 'green');
    
    
        svg.append('g')
            .attr('transform', `translate(0, ${height - padding})`)
            .call(xaxis);
    
        svg.append('g')
            .attr('transform', `translate(${padding}, 0)`)
            .call(yaxis);
    };
    
    btn0.onclick = draw;
    btn1.onclick = () => pre0.textContent = '';
    draw();
    
    
    
    
    
    
    
    
    
    
      

同じ範囲でもデータは異なる。

0 コメント:

コメントを投稿

Comments on Google+: