Komentar: Hari ini saya mempelajari kanvas HTML5 dan menemukan bahwa koordinat dan ukuran Fillrect salah. Setelah belajar untuk waktu yang lama, saya menemukan bahwa lebar dan ketinggian kanvas harus dilengkapi dengan tag kanvas.
Fillrect (100.100.100.100) 2 100s pertama merujuk pada koordinat, dan 2 100 terakhir merujuk pada lebar dan tinggi.Hari ini saya mempelajari kanvas HTML5 dan menemukan bahwa koordinat dan ukuran Fillrect salah. Setelah belajar untuk waktu yang lama, saya menemukan bahwa lebar dan ketinggian kanvas harus diinline ke dalam tag kanvas. Tertekan untuk waktu yang lama.
Metode kesalahan 1:
<! Doctype html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title> dokumen </iteme>
<tyle>
#mycanvas {
Lebar: 200px;
Tinggi: 200px;
Latar Belakang: Kuning;
}
</tyle>
</head>
<body>
<selvas>/canvas>
<script>
var c = document.geteLementById ('myCanvas');
var ctx = c.getContext ("2d");
ctx.fillstyle = '#f36';
ctx.fillrect (100, 100, 100, 100);
</script>
</body>
</html>
Cara yang salah 2:
<! Doctype html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title> dokumen </iteme>
</head>
<body>
<Canvas> </an Canvas>
<script>
var c = document.geteLementById ('myCanvas');
var ctx = c.getContext ("2d");
ctx.fillstyle = '#f36';
ctx.fillrect (100, 100, 100, 100);
</script>
</body>
</html>
Menunjukkan hasil:
Cara yang benar:
<! Doctype html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<title> dokumen </iteme>
</head>
<body>
<Canvas> </an Canvas>
<script>
var c = document.geteLementById ('myCanvas');
var ctx = c.getContext ("2d");
ctx.fillstyle = '#f36';
ctx.fillrect (100, 100, 100, 100);
</script>
</body>
</html>