Blog

HTML5 Canvas - Mengatur Lebar dan Warna Garis pada Canvas HTML 5

 

HTML5 Canvas - Mengatur Lebar dan Warna Garis pada Canvas HTML 5

HTML 5     3 weeks ago


Untuk menentukan lebar garis Canvas HTML5, kita dapat menggunakan properti lineWidth dari context canvas.

Untuk menetapkan warna garis Canvas HTML5, kita dapat menggunakan properti strokeStyle dari context canvas, yang dapat diatur ke string warna seperti merah, hijau, atau biru, nilai hex seperti # FF0000 atau # 555, atau nilai RGB seperti rgb (255, 0, 0).

Properti lineWidth harus diatur sebelum memanggil stroke().

<style>
  body {
    margin: 0px;
    padding: 0px;
  }
</style>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
  var canvas = document.getElementById('myCanvas');
  var context = canvas.getContext('2d');
  context.beginPath();
  context.moveTo(100, 150);
  context.lineTo(450, 50);
  context.lineWidth = 15;
  // set line color
  context.strokeStyle = '#ff0000';
  context.stroke();
</script>

 


CARI ARTIKEL
Card image cap
AUTHOR: Wisnu

"Client-facing" person. His goal - help clients/projects succeed and always coding.


Lihat Project Kami | Bertemu Tim Kami

Tertarik berkerja dengan kami? Email disini:
wisnu@tipa.co.id