• 0

كيف يمكنني الرسم بواسطة الوسم "Javascript_Canvas" ضمن المتصفح؟ و هل من أمثلة على ذلك؟

كيف يمكنني الرسم بواسطة الوسم "Javascript_Canvas" ضمن المتصفح؟ و هل من أمثلة على ذلك؟

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

يمكنك الرسم باستخدام الوسم "Canvas" لرسم الخطوط و الدوائر و التداخل بينها ، لا تدعم هذه الميزات إلا الإصدارات الأخيرة من متصفّحات الإنترنت الصّادرة ضمن الربع الثاني من عام 2015 و ما بعد ، فيمكنك تضمين شيفرة رسم خط أو رسم دائرة ضمن وسم "Script" في موقعك و ذلك كما يلي:

  • شيفرة رسم خط:
</script>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
في السطر البرمجي السابق يتم تحديد عرض الخط و لونه

</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.moveTo(10,10);
ctx.lineTo(150,50);
ctx.lineTo(10,50);
ctx.stroke();

</script>
  • شيفرة رسم دائرة:
<script>
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
في السطر البرمجي السابق تم تحديد عرض الخط المستخدم برسم الدائرة و لونه و أبعاد المستطيل الذي رسمت داخله الدائرة
</canvas>
<script type="text/javascript">

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.beginPath();
ctx.arc(70,18,15,0,Math.PI*2,true);
ctx.closePath();
ctx.fill();

</script>

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن