THT DUYURU
chat
THT Yardım Merkezi THT Yardım Merkezi bölümünden; teknoloji ve bilişim ile ilgili her konu için yardım isteyebilirsiniz.

ugursuz reklam
takipci
Seçenekler

Bu kodu nasıl ortalayabilirim.

propolis25 - ait Kullanıcı Resmi (Avatar)
Üye
Üyelik tarihi:
02/2016
Nereden:
izmir
Mesajlar:
139
Konular:
56
Teşekkür (Etti):
7
Teşekkür (Aldı):
6
Ticaret:
(0) %
1
223
08-12-2019 19:11
#1
Evet hocalarım bu kodu ortalamayı beceremedim bilen birisi yardım edebilirmi ?
Kod:
<html>
*********
  #myCanvas {
    border: 0;
    z-index: 1;
    position: absolute;
    left: 0px;
    top: 0px;
  }

  #myCanvas2 {
    border: 0;
    z-index: 0;
    position: absolute;
    left: 0px;
    top: 0px;
  }
 #myCanvas3 {
    border: 0;
    z-index: 2;
    position: absolute;
    left: 0px;
    top: 0px;
  }

</style>
<canvas id="myCanvas" width="800" height="800"></canvas>
<canvas id="myCanvas2" width="800" height="800"></canvas>
<canvas id="myCanvas3" width="800" height="800"></canvas>

<script>
  let canvas = ********.getElementById('myCanvas');
  let context = canvas.getContext('2d');
  let canvas2 = ********.getElementById('myCanvas2');
  let context2 = canvas2.getContext('2d');
  let canvas3 = ********.getElementById('myCanvas3');
  let context3 = canvas3.getContext('2d');

  context2.beginPath();
  context2.fillStyle = 'gray';
  context2.fillRect(0, 0, 800, 800);
  context2.rect(0, 0, 800, 800);
  context2.stroke();

  context.lineLength = 10;
  context2.lineLength = 10;

  class cizgi {
    constructor(x, y, renk) {
      this.x = x;
      this.y = y;
      this.renk = renk;
    }
  }


  var dizi = [];
  var dizi2 = [];
  var dizi3 = [];
  var dizi4 = [];
  var charDizi = [];
  let control = 0;
  let fpsControl = 0;

  charDizi[0] = "6";
  charDizi[1] = "6";
  charDizi[2] = "6";
  charDizi[3] = "e";
  charDizi[4] = "n";
  charDizi[5] = "d";
  charDizi[6] = "9";
  charDizi[7] = "9";
  charDizi[8] = "9";
  var charKontrol = 0;

  let region = new Path2D();
  region.arc(400, 400, 200, 0, 360);


  setInterval(function() {
    if (fpsControl % 6000 == 0) {
      context.clearRect(0, 0, 800, 800);
      context2.clearRect(0, 0, 800, 800);

    }

    if (fpsControl % 30 == 0) {
      if (dizi3.length < 30) {
        if (control % 2 == 0) {
          dizi3.push(new cizgi(650, 350, 'black'));

        } else {
          dizi3.push(new cizgi(650, 350, 'white'));
        }
      }

    }

    for (let i = 0; i < dizi3.length; i++) {
      if (dizi3[i] != null) {
        if (dizi3[i].x < 400) {
          dizi3[i] = null;
          dizi3.splice(i, 1);
          i--;

        } else {
          dizi3[i].x -= 30 / 60;
          dizi3[i].y -= 8.42 / 12;
          context.beginPath();
          context.strokeStyle = dizi3[i].renk;
          context.moveTo(400, 400 - dizi3[i].y);
          context.lineTo(dizi3[i].x, 400);
          context.lineTo(400, 400 + (dizi3[i].y));


          context.stroke();
        }

      }
    }

    if (fpsControl % 30 == 0) {

      if (dizi4.length < 30) {
        if (control % 2 == 0) {
          dizi4.push(new cizgi(150, 350, 'black'));

        } else {
          dizi4.push(new cizgi(150, 350, 'white'));

        }
      }

      control++;
    }

    for (let i = 0; i < dizi4.length; i++) {
      if (dizi4[i] != null) {
        if (dizi4[i].x > 400) {
          dizi4[i] = null;
          dizi4.splice(i, 1);
          i--;
        } else {
          dizi4[i].x += 30 / 60;
          dizi4[i].y -= 8.42 / 12;
          context.beginPath();
          context.strokeStyle = dizi4[i].renk;
          context.moveTo(400, 400 - dizi4[i].y);
          context.lineTo(dizi4[i].x, 400);
          context.lineTo(400, 400 + (dizi4[i].y));


          context.stroke();
        }

      }
    }


    if (fpsControl % 30 == 0) {

      if (dizi.length < 60) {
        if (control % 2 == 0) {
          dizi.push(new cizgi(400, 0, 'black'));

        } else {
          dizi.push(new cizgi(400, 0, 'white'));

        }
      }


    }
    if (fpsControl % 30 == 0) {
            context3.clearRect(0, 0, 800, 800);

      context3.font = "800 25px Helvetica";
      context3.shadowOffsetX = 4;
      context3.shadowOffsetY = 4;
      context3.shadowColor = "rgba(0,0,0,0.8)";
      context3.fillText(charDizi[charKontrol], 391, 409);

     context3.fillStyle = "white";

      charKontrol++;

      if(charKontrol==charDizi.length)
      {
        charKontrol=0;
      }
    }
    for (let i = 0; i < dizi.length; i++) {
      if (dizi[i] != null) {
        if (dizi[i].x > 1600) {
          /* dizi[i] = null;
           dizi.splice(i, 1);
           i--;*/
          dizi[i].x = 400;
          dizi[i].y = 0;
          console.log("fps:" + dizi.length);

        } else {
          dizi[i].x += 50 / 60;
          dizi[i].y += 31.25 / 60;
          context2.beginPath();
          context2.strokeStyle = dizi[i].renk;
          context2.moveTo(400, 400 - dizi[i].y);
          context2.lineTo(dizi[i].x, 400);
          context2.lineTo(400, 400 + (dizi[i].y));


          context2.stroke();
        }

      }
    }
    if (fpsControl % 30 == 0) {
      if (dizi2.length < 60) {
        if (control % 2 == 0) {
          dizi2.push(new cizgi(400, 0, 'black'));

        } else {
          dizi2.push(new cizgi(400, 0, 'white'));

        }
      }


    }

    for (let i = 0; i < dizi2.length; i++) {
      if (dizi2[i] != null) {
        if (dizi2[i].x < -800) {
          dizi2[i].x = 400;
          dizi2[i].y = 0;

        } else {
          dizi2[i].x -= 50 / 60;
          dizi2[i].y += 31.25 / 60;
          context2.beginPath();
          context2.strokeStyle = dizi2[i].renk;
          context2.moveTo(400, 400 + dizi2[i].y);
          context2.lineTo(dizi2[i].x, 400);
          context2.lineTo(400, 400 - (dizi2[i].y));
          context2.stroke();
        }

      }
    }
    fpsControl++;

  }, 4)
  context.clip(region, "evenodd");

  //Anim 32

</script>

</html>
--------------------- Mustafa Kemal ATATÜRK
'Börteçine - ait Kullanıcı Resmi (Avatar)
Moderasyon Lider Yardımcısı
Üyelik tarihi:
02/2016
Nereden:
google
Mesajlar:
6.385
Konular:
1600
Teşekkür (Etti):
204
Teşekkür (Aldı):
890
Ticaret:
(0) %
15-12-2019 15:23
#2
merhaba

Kod:
<div align="center">html>
  *********
  #myCanvas {
  border: 0;
  z-index: 1;
  position: absolute;
  left: 0px;
  top: 0px;
  }
  
  #myCanvas2 {
  border: 0;
  z-index: 0;
  position: absolute;
  left: 0px;
  top: 0px;
  }
  #myCanvas3 {
  border: 0;
  z-index: 2;
  position: absolute;
  left: 0px;
  top: 0px;
  }
  
  </style>
  <canvas id="myCanvas" width="800" height="800"></canvas>
  <canvas id="myCanvas2" width="800" height="800"></canvas>
  <canvas id="myCanvas3" width="800" height="800"></canvas>
  
  <script>
  let canvas = ********.getElementById('myCanvas');
  let context = canvas.getContext('2d');
  let canvas2 = ********.getElementById('myCanvas2');
  let context2 = canvas2.getContext('2d');
  let canvas3 = ********.getElementById('myCanvas3');
  let context3 = canvas3.getContext('2d');

  context2.beginPath();
  context2.fillStyle = 'gray';
  context2.fillRect(0, 0, 800, 800);
  context2.rect(0, 0, 800, 800);
  context2.stroke();

  context.lineLength = 10;
  context2.lineLength = 10;

  class cizgi {
    constructor(x, y, renk) {
      this.x = x;
      this.y = y;
      this.renk = renk;
    }
  }


  var dizi = [];
  var dizi2 = [];
  var dizi3 = [];
  var dizi4 = [];
  var charDizi = [];
  let control = 0;
  let fpsControl = 0;

  charDizi[0] = "6";
  charDizi[1] = "6";
  charDizi[2] = "6";
  charDizi[3] = "e";
  charDizi[4] = "n";
  charDizi[5] = "d";
  charDizi[6] = "9";
  charDizi[7] = "9";
  charDizi[8] = "9";
  var charKontrol = 0;

  let region = new Path2D();
  region.arc(400, 400, 200, 0, 360);


  setInterval(function() {
    if (fpsControl % 6000 == 0) {
      context.clearRect(0, 0, 800, 800);
      context2.clearRect(0, 0, 800, 800);

    }

    if (fpsControl % 30 == 0) {
      if (dizi3.length < 30) {
        if (control % 2 == 0) {
          dizi3.push(new cizgi(650, 350, 'black'));

        } else {
          dizi3.push(new cizgi(650, 350, 'white'));
        }
      }

    }

    for (let i = 0; i < dizi3.length; i++) {
      if (dizi3[i] != null) {
        if (dizi3[i].x < 400) {
          dizi3[i] = null;
          dizi3.splice(i, 1);
          i--;

        } else {
          dizi3[i].x -= 30 / 60;
          dizi3[i].y -= 8.42 / 12;
          context.beginPath();
          context.strokeStyle = dizi3[i].renk;
          context.moveTo(400, 400 - dizi3[i].y);
          context.lineTo(dizi3[i].x, 400);
          context.lineTo(400, 400 + (dizi3[i].y));


          context.stroke();
        }

      }
    }

    if (fpsControl % 30 == 0) {

      if (dizi4.length < 30) {
        if (control % 2 == 0) {
          dizi4.push(new cizgi(150, 350, 'black'));

        } else {
          dizi4.push(new cizgi(150, 350, 'white'));

        }
      }

      control++;
    }

    for (let i = 0; i < dizi4.length; i++) {
      if (dizi4[i] != null) {
        if (dizi4[i].x > 400) {
          dizi4[i] = null;
          dizi4.splice(i, 1);
          i--;
        } else {
          dizi4[i].x += 30 / 60;
          dizi4[i].y -= 8.42 / 12;
          context.beginPath();
          context.strokeStyle = dizi4[i].renk;
          context.moveTo(400, 400 - dizi4[i].y);
          context.lineTo(dizi4[i].x, 400);
          context.lineTo(400, 400 + (dizi4[i].y));


          context.stroke();
        }

      }
    }


    if (fpsControl % 30 == 0) {

      if (dizi.length < 60) {
        if (control % 2 == 0) {
          dizi.push(new cizgi(400, 0, 'black'));

        } else {
          dizi.push(new cizgi(400, 0, 'white'));

        }
      }


    }
    if (fpsControl % 30 == 0) {
            context3.clearRect(0, 0, 800, 800);

      context3.font = "800 25px Helvetica";
      context3.shadowOffsetX = 4;
      context3.shadowOffsetY = 4;
      context3.shadowColor = "rgba(0,0,0,0.8)";
      context3.fillText(charDizi[charKontrol], 391, 409);

     context3.fillStyle = "white";

      charKontrol++;

      if(charKontrol==charDizi.length)
      {
        charKontrol=0;
      }
    }
    for (let i = 0; i < dizi.length; i++) {
      if (dizi[i] != null) {
        if (dizi[i].x > 1600) {
          /* dizi[i] = null;
           dizi.splice(i, 1);
           i--;*/
          dizi[i].x = 400;
          dizi[i].y = 0;
          console.log("fps:" + dizi.length);

        } else {
          dizi[i].x += 50 / 60;
          dizi[i].y += 31.25 / 60;
          context2.beginPath();
          context2.strokeStyle = dizi[i].renk;
          context2.moveTo(400, 400 - dizi[i].y);
          context2.lineTo(dizi[i].x, 400);
          context2.lineTo(400, 400 + (dizi[i].y));


          context2.stroke();
        }

      }
    }
    if (fpsControl % 30 == 0) {
      if (dizi2.length < 60) {
        if (control % 2 == 0) {
          dizi2.push(new cizgi(400, 0, 'black'));

        } else {
          dizi2.push(new cizgi(400, 0, 'white'));

        }
      }


    }

    for (let i = 0; i < dizi2.length; i++) {
      if (dizi2[i] != null) {
        if (dizi2[i].x < -800) {
          dizi2[i].x = 400;
          dizi2[i].y = 0;

        } else {
          dizi2[i].x -= 50 / 60;
          dizi2[i].y += 31.25 / 60;
          context2.beginPath();
          context2.strokeStyle = dizi2[i].renk;
          context2.moveTo(400, 400 + dizi2[i].y);
          context2.lineTo(dizi2[i].x, 400);
          context2.lineTo(400, 400 - (dizi2[i].y));
          context2.stroke();
        }

      }
    }
    fpsControl++;

  }, 4)
  context.clip(region, "evenodd");

  //Anim 32

</script>
</div>
</html>
---------------------
Adalet ölünce soytarılar kral olurmuş

Bookmarks


« Önceki Konu | Sonraki Konu »
Seçenekler