20-03  反比例のグラフを描こう

学習日

10月28日 / 11月4日  火曜日

名前

中村 結

✅練習問題20-3-3

let scale = 20;
function toScreenX(x){ return width/2 + x*scale; }
function toScreenY(y){ return height/2 - y*scale; }

function setup(){
  createCanvas(400, 400);
  background(255);

  for (let x = 20; x <= 400; x+=20) {
    stroke(200);
    line(x,0,x,400);
    line(0,x,400,x);
  }
  stroke(0);
  line(200,0,200,400);
  line(0,200,400,200);

  // 省略:格子線のソースコード

  stroke(0);
  for (let x = -10; x <= 10; x += 0.05){
     let y = 1 / x;
     if(abs(y)>0.01){
       point(toScreenX(x), toScreenY(y));
     }
  }
}

abs()は()の中の数値の絶対値を出してくれる

✅練習問題20-3-5

xを-10から0.05ずつ増やしていってそこを点で取っているからxが0を超えて正の数になると下に進んでた、点がいきなり上になるからそこまで点がつながっちゃうから。

✅練習問題20-3-6

let scale = 20;
function toScreenX(x){ return width/2 + x*scale; }
function toScreenY(y){ return height/2 - y*scale; }

function setup(){
  createCanvas(400, 400);
  background(255);

  for (let x = 20; x <= 400; x+=20) {
    stroke(200);
    line(x,0,x,400);
    line(0,x,400,x);
  }
  stroke(0);
  line(200,0,200,400);
  line(0,200,400,200);

  // 省略:格子線のソースコード

  stroke(255,0,0);
  noFill();
  beginShape();
  for (let x = -10; x <= 0; x += 0.05){
     let y = 1 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
  beginShape();
  for (let x = 0; x <= 10; x += 0.05){
     let y = 1 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
}

✅練習問題20-3-7

let scale = 20;
function toScreenX(x){ return width/2 + x*scale; }
function toScreenY(y){ return height/2 - y*scale; }

function setup(){
  createCanvas(400, 400);
  background(255);

  for (let x = 20; x <= 400; x+=20) {
    stroke(200);
    line(x,0,x,400);
    line(0,x,400,x);
  }
  stroke(0);
  line(200,0,200,400);
  line(0,200,400,200);

  // 省略:格子線のソースコード

  stroke(255,0,0);
  noFill();
  beginShape();
  for (let x = -10; x <= 0; x += 0.05){
     let y = 2 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
  beginShape();
  for (let x = 0; x <= 10; x += 0.05){
     let y = 2 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
  
  stroke(0,255,0);
  noFill();
  beginShape();
  for (let x = -10; x <= 0; x += 0.05){
     let y = 0.5 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
  beginShape();
  for (let x = 0; x <= 10; x += 0.05){
     let y = 0.5 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
  
   stroke(0,0,225);
  noFill();
  beginShape();
  for (let x = -10; x <= 0; x += 0.05){
     let y = -1 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
  beginShape();
  for (let x = 0; x <= 10; x += 0.05){
     let y = -1 / x;
     if(abs(x)>0.01){
       curveVertex(toScreenX(x),toScreenY(y));
     }
   }
  endShape();
}

✅練習問題20-3-8

for文のステップを0.05から0.001に変えても滑らかさは変わらなかった。

コメントする