2017年5月10日水曜日

学習環境

解析入門〈1〉(松坂 和夫(著)、岩波書店)の第5章(各種の初等関数)、5.3(三角関数)、問題11.を取り組んでみる。

n

  1. P 1 :( 0, y 1 ) P 2 :( x 2 , y 2 ) X:( x,0 ) f( x )= x 2 + y 1 2 v 1 + ( x x 2 ) 2 + y 2 2 v 2 f'( x )= 1 2 v 1 ( x 2 + y 1 2 ) 1 2 ·2x+ 1 2 v 2 ( ( x x 2 ) 2 + y 2 2 ) 1 2 2( x x 2 ) = x v 1 x 2 + y 1 2 + x x 2 v 2 ( x x 2 ) 2 + y 2 2 = sin θ 1 ( x ) v 1 sin θ 2 ( x ) v 2 θ 1 ( x )調 θ 2 ( x )調 sin θ 1 ( x )調 sin θ 2 ( x )調 f'( x )調 f'( 0 )<0 f'( x 2 )>0 f'( x 0 )=0( 0< x 0 < x 2 ) x 0 A:( x 0 ,0 ) θ 1 = θ 1 ( x 0 ) θ 2 = θ 2 ( x 0 ) sin θ 1 v 1 sin θ 2 v 2 =0 sin θ 1 v 1 = sin θ 2 v 2

コード(Emacs)

HTML5

<div id="graph0"></div>
<pre id="output0"></pre>
P1 = (0, <input id="y1" type="number" min="0.001" value="5">),
P2 = (<input id="x2" type="number" value="5">, <input id="y2" type="number" max="-0.001" value="-5">),
X = (<input id="x0" type="number" step="0.01" value="2.5">, 0), 
<label for="v1">v1 = </label><input id="v1" min="0.001" value="20">, 
<label for="v2">v2 = </label><input id="v2" min="0.001" value="200">

<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="sample11.js"></script>    

JavaScript

let div0 = document.querySelector('#graph0'),
    pre0 = document.querySelector('#output0'),
    width = 600,
    height = 600,
    padding = 50,
    btn0 = document.querySelector('#draw0'),
    btn1 = document.querySelector('#clear0'),
    input_y1 = document.querySelector('#y1'),
    input_x2 = document.querySelector('#x2'),
    input_y2 = document.querySelector('#y2'),
    input_x0 = document.querySelector('#x0'),
    input_v1 = document.querySelector('#v1'),
    input_v2 = document.querySelector('#v2'),
    inputs = [input_y1, input_x2, input_y2, input_x0, input_v1, input_v2],
    p = (x) => pre0.textContent += x + '\n';

let draw = () => {
    pre0.textContent = '';

    let y1 = parseFloat(input_y1.value),
        x2 = parseFloat(input_x2.value),
        y2 = parseFloat(input_y2.value),
        x0 = parseFloat(input_x0.value),
        lines = [[0, y1, x0, 0], [x0, 0, x2, y2]],
        v1 = parseFloat(input_v1.value),
        v2 = parseFloat(input_v2.value),
        p1x = Math.sqrt(x0 ** 2 + y1 ** 2),
        theta1 = Math.asin(x0 / p1x),
        p2x = Math.sqrt((x2 - x0) ** 2 + y2 ** 2),
        theta2 = Math.asin((x2 - x0) / p2x),
        t = p1x / v1 + p2x / v2;

    let d1 = Math.min(0, x0, y2),
        d2 = Math.max(y1, x0, x2);
    
    let xscale = d3.scaleLinear()
        .domain([d1, d2])
        .range([padding, width - padding]);
    let yscale = d3.scaleLinear()
        .domain([d1, d2])
        .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('line')
        .data(lines)
        .enter()
        .append('line')
        .attr('x1', (d) => xscale(d[0]))
        .attr('y1', (d) => yscale(d[1]))
        .attr('x2', (d) => xscale(d[2]))
        .attr('y2', (d) => yscale(d[3]))
        .attr('stroke', (d, i) => i === 0 ? 'green' : 'blue');

    svg.append('g')
        .attr('transform', `translate(0, ${yscale(0)})`)
        .call(xaxis);

    svg.append('g')
        .attr('transform', `translate(${xscale(0)}, 0)`)
        .call(yaxis);
    p(`time: ${t}`);
    p(1 = ${theta1}`);
    p(2 = ${theta2}`);
    p(`sin θ1 / v1 = ${Math.sin(theta1) / v1}`);
    p(`sin θ2 / v2 = ${Math.sin(theta2) / v2}`);
    p(`difference: ${Math.abs(Math.sin(theta1) / v1 - Math.sin(theta2) / v2)}`);
};

inputs.forEach((input) => input.onchange = draw);
btn0.onclick = draw;
btn1.onclick = () => pre0.textContent = '';
draw();

P1 = (0, ),
P2 = (, ),
X = (, 0), 
, 


















						

0 コメント:

コメントを投稿

Comments on Google+: