数学 - 線型代数 - JavaScript - 複素数、複素ベクトル空間(極形式、n乗根)

線型代数入門

学習環境/開発環境

• Surface 3 (4G LTE)、Surface 3 タイプ カバー、Surface ペン(端末)
• Windows 10 Pro (OS)
• 数式入力ソフト(TeX, MathML): MathType
• MathML対応ブラウザ: Firefox、Safari
• MathML非対応ブラウザ(Internet Explorer, Google Chrome...)用JavaScript Library: MathJax
• OS X El Capitan - Apple (OS)
• Emacs (Text Editor)
• JavaScript (プログラミング言語)
• kjs-array (JavaScript Library)
• kjs-math-number (JavaScript Library)
• D3.js (JavaScript Library)
• Safari(Web browser)

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

問3.

1. 
   $\begin{array}{l}1+i=\sqrt{2}(\cos \frac{\pi }{4}+i\sin \frac{\pi }{4})\hfill \\ {(1+i)}^{\frac{1}{2}}=2^{\frac{1}{4}}(\cos \frac{\frac{\pi }{4}+2k\pi }{2}+i\sin \frac{\frac{\pi }{4}+2k\pi }{2})\hfill \\ =2^{\frac{1}{4}}(\cos (\frac{\pi }{8}+k\pi )+i\sin (\frac{\pi }{8}+k\pi ))(k=0,1)\hfill \end{array}$
2. 
   $\begin{array}{l}i=\cos \frac{\pi }{2}+i\sin \frac{\pi }{2}\\ i^{\frac{1}{3}}=\cos \left(\frac{\pi }{6}+\frac{2}{3}k\pi \right)+i\sin \left(\frac{\pi }{6}+\frac{2}{3}k\pi \right)\left(k=0,1,2\right)\end{array}$
3. 
   $\begin{array}{l}{(2(-1+\sqrt{3}i))}^{\frac{1}{4}}\hfill \\ ={(2·2(\cos \frac{2\pi }{3}+i\sin \frac{2\pi }{3}))}^{\frac{1}{4}}\hfill \\ =\sqrt{2}(\cos (\frac{\pi }{6}+\frac{k\pi }{2})+i\sin (\frac{\pi }{6}+\frac{k\pi }{2}))\left(k=0,1,2,3\right)\hfill \end{array}$
4. 
   $\begin{array}{l}{(-1)}^{\frac{1}{5}}\hfill \\ ={(\cos \pi +i\sin \pi )}^{\frac{1}{5}}\hfill \\ =\cos (\frac{1}{5}\pi +\frac{2k\pi }{5})+i\sin (\frac{1}{5}\pi +\frac{2k\pi }{5})\left(k=0,1,2,3,4\right)\hfill \end{array}$

number.js で確認。

HTML5

<div id="graph0"></div>
<label for="r0">
  r =
</label>
<input id="r0" type="number" min="0.0001" step="0.0001" value="1.1892">
<br>
<label for="theta0">
  θ =
</label>
<input id="theta0" type="number" step="0.0001" value="0.3925">
<br>
<label for="alpha0">
  α =
</label>
<input id="alpha0" type="number" step="0.0001"  value="3.14">
<br>
<label for="k0">
  k =
</label>
<input id="k0" type="number" min="0" step="1" value="2">
<br>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.2.2/d3.min.js"></script>

<script src="array.js"></script>
<script src="number.js"></script>
<script src="sample3.js"></script>

JavaScript

コード(Emacs)

(function () {
    'use strict';
    var div_graph = document.querySelector('#graph0'),
        input_r = document.querySelector('#r0'),
        input_theta = document.querySelector('#theta0'),
        input_alpha = document.querySelector('#alpha0'),
        input_k = document.querySelector('#k0'),
        inputs = [input_r, input_theta, input_alpha, input_k],
        getLines,
        getPoints,
        draw;

    getPoints = function (r, theta, alpha, n) {
        return Array.range(n).map(function (k) {
            var c = Complex.fromMagnitudeAndArgment(r, theta + k * alpha);

            return [c.getReal(), c.getImag()];
        });
    };
    getLines = function (r, theta, alpha, n) {
        var lines;
        
        lines =  Array.range(n).map(function (k) {
            var c = Complex.fromMagnitudeAndArgment(r, theta + k * alpha);

            return [c.getReal(), c.getImag(),
                    (theta + k * alpha) % (2 * Math.PI)];
        });
        lines.sort(function (x, y) {
            return x[2] - y[2];
        });
        lines.push(lines[0]);
        return lines;
    };
    draw = function () {
        var r = parseFloat(input_r.value),
            theta = parseFloat(input_theta.value),
            alpha = parseFloat(input_alpha.value),
            k = parseFloat(input_k.value),
            points = getPoints(r, theta, alpha, k),
            lines = getLines(r, theta, alpha, k),
            svg,
            width = 600,
            height = 600,
            padding = 50,
            min = -r * 1.5,
            max = -min,
            xscale,
            yscale,
            xaxis,
            yaxis;

        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);

        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 xscale(d[0]);
            })
            .attr('cy', function (d) {
                return yscale(d[1]);
            })
            .attr('r', 5)
            .attr('fill', 'green');

        svg.append('circle')
            .attr('cx', xscale(0))
            .attr('cy', yscale(0))
            .attr('r', xscale(r) - xscale(0))
            .attr('fill', 'rgba(0, 0, 0, 0)')
            .attr('stroke', 'blue');

        svg.selectAll('line')
            .data(lines.slice(0, -1))
            .enter()
            .append('line')
            .attr('x1', function (d) {            
                return xscale(d[0]);
            })
            .attr('y1', function (d) {
                return yscale(d[1]);
            })
            .attr('x2', function (d, i) {
                return xscale(lines[i + 1][0]);
            })
            .attr('y2', function (d, i) {
                return yscale(lines[i + 1][1]);
            })
            .attr('stroke', 'red');
        
        svg.append('g')
            .attr('transform', 'translate(0, ' + (height / 2) + ')')
            .call(xaxis);
        svg.append('g')
            .attr('transform', 'translate(' + (width / 2) + ', 0)')
            .call(yaxis);
        
    };
    inputs.forEach(function (input) {
        input.onchange = draw;
    });

    draw();
}());

r =
θ =
α =
k =