Malisa Huzaifa - Web Multimedia HTML6 Canvas & SVG

38 </head> <body> <canvas id="canvas" width="200" height="150" style="border:1px solid #DC143C;"> </canvas> <script type="text/javascript"> var cvs = document.getElementById("canvas"); var ctx = cvs.getContext("2d"); ctx.font = "25px Italic"; cvs.addEventListener("mousemove", function(e) { var cRect = cvs.getBoundingClientRect(); var canvasY = Math.round(e.clientY – cRect.top); var canvasX = Math.round(e.clientX - cRect.left); ctx.clearRect(0, 0, cvs.width, cvs.height); ctx.fillText("X: "+canvasX+", Y: "+ canvasY,10,20); }); </script> </body> </html> Referensi : Learning HTML5 Canvas (modifikasi) Tahapan awal yang harus dilakukan adalah menyediakan sebuah canvas yang akan digunakan. Kemudian kita mulai dengan menentukan ukuran tulisan yang akan menampilkan angka koordinat

RkJQdWJsaXNoZXIy MTM3NDc5MQ==