2016年9月13日火曜日

学習環境/開発環境

線型代数入門 (松坂 和夫(著)、岩波書店)の第4章(複素数、複素ベクトル空間)、4(二項方程式)、問1.を取り組んでみる。

問1.

4 k=0,1,2,3 cos 2kπ 4 +isin 2kπ 4 =cos π 2 k+isin π 2 k =1,i,1,i 6 k=0,1,2,3,4,5 cos 2kπ 6 +isin 2kπ 6 =cos π 3 k+isin π 3 k =1, 1 2 + 3 2 i, 1 2 + 3 2 i,1, 1 2 3 2 i, 1 2 3 2 i

JavaScript(number.js) で確認してみる。

HTML5

<div id="graph0"></div>
<label for="n0">
  n =
</label>
<input id="n0" type="number" min="1" step="1" value="4">
<br>
<br>
<div id="output0"></div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.2.2/d3.min.js"></script>
<script src="number.js"></script>
<script src="sample1.js"></script>

JavaScript

コード(Emacs)

(function () {
    'use strict';
    var width = 600,
        height = 600,
        padding = 50,
        min = -1.5,
        max = 1.5,
        xscale,
        yscale,
        xaxis,
        yaxis,
        svg,
        div_graph = document.querySelector('#graph0'),
        input_n = document.querySelector('#n0'),
        div_output = document.querySelector('#output0'),    
        calc,
        draw,
        output;

    xscale = d3.scaleLinear()
        .domain([min, max])
        .range([padding, width - padding]);
    yscale = d3.scaleLinear()
        .domain([min, max])
        .range([height - padding, padding]);
    xaxis = d3.axisBottom().scale(xscale);
    yaxis = d3.axisLeft().scale(yscale);

    calc = function (n) {
        var answers = [],
            k,
            z,
            theta;

        for (k = 0; k < n; k += 1) {
            theta = 2 * k * Math.PI / n;
            z = new Complex(Math.cos(theta), Math.sin(theta));
            answers.push(z);
        }
        return answers;
    };
    draw = function (answers) {
        var points;

        points = answers.map(function (z) {
            return [xscale(z.getReal()), yscale(z.getImag())];
        });
        div_graph.innerHTML = '';
        svg = d3.select('#graph0')
            .append('svg')
            .attr('width', width)
            .attr('height', height);
        svg.selectAll('circle')
            .data(points)
            .enter()
            .append('circle')
            .attr('cx', function (d) {
                return d[0];
            })
            .attr('cy', function (d) {
                return d[1];
            })
            .attr('r', 5)
            .attr('fill', 'green');

        points.push(points[0]);
        svg.selectAll('line')
            .data(points.slice(0, -1))
            .enter()
            .append('line')
            .attr('x1', function (d) {
                return d[0];
            })
            .attr('y1', function (d) {
                return d[1];
            })
            .attr('x2', function (d, i) {
                return points[i + 1][0];
            })
            .attr('y2', function (d, i) {
                return points[i + 1][1];
            })
            .attr('stroke', 'red');
        
        svg.append('circle')
            .attr('cx', xscale(0))
            .attr('cy', yscale(0))
            .attr('r', xscale(1) - xscale(0))
            .attr('stroke', 'blue')
            .attr('fill', 'rgba(0, 0, 0, 0)');

        svg.append('g')
            .attr('transform', 'translate(0, ' + (height / 2) + ')')
            .call(xaxis);
        svg.append('g')
            .attr('transform', 'translate(' + (width / 2) + ', 0)')
            .call(yaxis);
    };
    output = function () {
        var n = parseInt(input_n.value, 10),
            answers = calc(n);
        draw(answers);

        div_output.innerHTML = '';
        answers.forEach(function (answer, i) {
            div_output.innerHTML +=
                '<math>' + answer + '</math> (k = ' + i + ')<br><br>';
        });
    };

    input_n.onchange = output;
    output();
}());


0 コメント:

コメントを投稿

Comments on Google+: