ສາຍວິຊາ HTML Canvas

ປະກອບ <canvas> HTML ຂອງເວັບໄຊໄດ້ຂຽນຮູບພາບໃນເວັບໄຊ。

上面的图形是用 创建的。

它显示了四个元素：红色矩形、渐变矩形、多色矩形和多色文本。

什么是 HTML Canvas？

HTML 元素用于通过脚本（通常是 JavaScript）动态地绘制图形。

元素只是图形的容器。您必须使用脚本来绘制实际的图形。

Canvas 有多种方法用于绘制路径、方框、圆形、文本和添加图像。

HTML Canvas 可以绘制文本

Canvas 可以绘制彩色文本，还可带动画效果。

HTML Canvas 可以绘制图形

Canvas 拥有使用图形和图表进行图形化数据呈现的强大能力。

HTML Canvas 可以动画化

Canvas 对象可以移动。一切皆有可能：从简单的弹跳球到复杂的动画。

Canvas HTML ສາມາດຕິດຕໍ່

Canvas ສາມາດຕອບກັບການກະທຳ JavaScript。

Canvas ສາມາດຕອບກັບການກະທຳຜູ້ນຳໃຊ້ (ຄຳສັງງານຄັກລັງການລັງສັງງານຄັກລັງການລັງສັງງານຄັກລັງການລັງສັງງານ)

Canvas HTML ສາມາດນຳໃຊ້ເພື່ອເກມ

ວິທີການສະແດງການຄວາມສະເທືອນຂອງ Canvas ສະເພາະສະໜັບສະໜູນການຫຼີ້ນເກມ HTML5。

Canvas Example

ໃນ HTML ບັນຊີວັດ <canvas> ແມ່ນເບິ່ງຄືເຫັນດັ່ງກ່າວ:

<canvas id="myCanvas" width="200" height="100"></canvas>

ບັນຊີວັດ <canvas> ຕ້ອງມີຂອບເຂດ id ເພື່ອສາມາດອ້າງຕົວຂອງ JavaScript。

width ແລະ height ຂອງບັນຊີວັດສະເພາະສຳລັບການກໍານົດຂະໜາດການແກ້ວ。

ຄຳແນະນຳ: ບັນຊີວັດ <canvas> ສະເພາະມີຫຼາຍຫນັງໃນໜ້າ HTML。

ໂດຍກົງການຫນັງນັ້ນ <canvas> ສະມາຊິດບໍ່ມີບານບາງແລະບໍ່ມີຂັດຂອງບັນຊີວັດ。

ສຳລັບການເພີ່ມບານບາງກັບ style ຂອງບັນຊີວັດ:

ຄວາມຄົນ

<canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;"></canvas>

ທຳການທີ່ຂ້ອຍຈະທົດລອງດັ່ງກ່າວ

ຫນັງນັ້ນຫນັງນັ້ນຈະສະເໜີວິທີທີ່ຈະຂຽນພາບໃນການແກ້ວ。

ຍັງບອກວ່າ:

ຄູ່ມືຄວາມກະດີ Canvas ທັງໝົດຈາກ CodeW3C.com

ການສະໜັບສະໜູນບັນຊີວັດ

<canvas> ສະມາຊິກແມ່ນສະເພາະຂອງ HTML5 (2014)。

ທຸກບັນຊີວັດສະໄໝຫຼັງນັບຕັ້ງແຕ່ຫນັງສັນຕະວັດທີ່ພິມມູນນິທິຄວາມກະດີ <canvas>：