HTML canvas Tag
HTML canvas Tag – يٌستخدم الوسم <canvas> لرسم رسومات سريعة عبر البرمجة النصية (عادةً بإستخدام JavaScript).
HTML can2vas Tag
الوسم <canvas> يحدد منطقة في الصفحة شفافة، وهي مجرد حاوية للرسومات، يجب استخدام برنامج نصي script لرسم الرسومات.
على سبيل المثال ، يمكنك استخدام وسم <canvas> لرسم المسارات والأشكال الهندسية والرسوم البيانية والنصوص.
مثال
<canvas id="demoCanvas" width="300" height="200">
Sorry, Your browser doesn't support Canvas tag!
</canvas>
<script>
window.onload = function() {
var cnvs = document.getElementById("demoCanvas");
var ctx = cnvs.getContext("2d");
/* syntax: context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false); */
ctx.arc(150, 100, 70, 0, 2 * Math.PI, false);
ctx.stroke();
};
</script>
سيتم عرض أي نص داخل عنصر <canvas> في المتصفحات التي تم تعطيل JavaScript فيها وفي المتصفحات التي لا تدعم <canvas>.
السمات المحددة – Specific Attributes
يدعم الوسم <canvas> هذه السمات:
| السمة | القيمة | الوصف |
|---|---|---|
| height | pixels | يحدد ارتفاع الـ Canvas. |
| width | pixels | يحدد عرض الـ Canvas. |
القيمة الافتراضية لكل من السمتين height و width هي 150.
السمات العامة – Global Attributes
الوسم <canvas> يدعم السمات العامة أيضًا، تعرف عليهم عن طريق هذا الرابط: السمات العامة – Global Attributes.
سمات الحدث – Event Attributes
يدعم وسم <canvas> سمات الحدث أيضًا، تعرف عليهم عن طريق هذا الرابط: سمات الحدث – Event Attributes.
دعم المتصفحات
| المتصفح |  |  |  |  |  |
| من بداية الإصدار | 2.0 | 4.0 | 9.0 | 3.1 | 9.0 |