HTML canvas Tag

HTML canvas Tag – يٌستخدم الوسم <canvas> لرسم رسومات سريعة عبر البرمجة النصية (عادةً بإستخدام JavaScript).

HTML canvas 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>.