Kodmatik Murat BEKLER | Donanıma can veren ruh, yazılımdır.
Hadi kodlarla çizgiler çizelim.
HTML5 Canvas kullanarak bir çizgi çizmek için, beginPath (), moveTo (), lineTo () ve inme () yöntemlerini kullanabilirsiniz.
Öncelikle, biz yeni bir yol çizmek üzere olduğunu bildirmek için beginPath () yöntemini kullanabilirsiniz. Sonra, yeni bir konuma başlangıç pozisyonuna düz bir çizgi çizmek için lineTo () yöntemini kullanın ardından bağlam noktası (yani çizim imleç) konumuna moveTo () yöntemini kullanabilirsiniz ve. Nihayet, çizgi görünür hale getirmek için, biz kontur kullanarak hattına kontur uygulayabilirsiniz (). Aksi belirtilmedikçe, kontur rengi siyah öndeğer edilir.
Örnek çizim:
Kod:
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="cizgi" width="678" height="320"></canvas>
<script>
var canvas = document.getElementById('cizgi');
var context = canvas.getContext('2d');
context.beginPath();
context.moveTo(100, 150);
context.lineTo(450, 50);
context.stroke();
</script>
</body>
</html>