HTML Canvas শিক্ষা

হটমেল HTML <canvas> এলিমেন্ট ওয়েবসাইটে গ্রাফিক্স ড্রায়িং করার জন্য ব্যবহৃত হয়。

উপরের গ্রাফিক্সটি <canvas> দ্বারা তৈরি হয়েছে।

এটি চারটি এলিমেন্ট দেখায়: লাল বর্গ, শুষ্ক বর্গ, বহুবর্ণ বর্গ এবং বহুবর্ণ টেক্সট。

কি হল HTML Canvas?

HTML <canvas> এলিমেন্টটি স্ক্রিপ্ট (সাধারণত JavaScript) দ্বারা গ্রাফিক্সকে অবিকৃতভাবে দ্রব্য করার জন্য ব্যবহৃত হয়。

<canvas> এলিমেন্টটি হল গ্রাফিক্সের একটি কনটেনার। একটি সত্যিকারী গ্রাফিক্স দ্রব্য করতে আপনাকে স্ক্রিপ্ট ব্যবহার করতে হবে。

Canvas-এর মাধ্যমে পথ, বর্গ, বৃত্ত, টেক্সট এবং ছবি যোগ করার জন্য বেশ কিছু পদ্ধতি রয়েছে。

HTML Canvas-এর মাধ্যমে টেক্সট দ্রব্য করা যায়

Canvas-এর মাধ্যমে রঙায়িত টেক্সট দ্রব্য করা যায়, এবং অ্যানিমেশন সহ থাকতে পারে。

HTML Canvas-এর মাধ্যমে গ্রাফিক্স দ্রব্য করা যায়

Canvas-এর মাধ্যমে গ্রাফিক্স এবং চিত্রাঙ্কনকে গ্রাফিক্স এবং চিত্রাঙ্কনের জন্য শক্তিশালী ক্ষমতা রয়েছে。

HTML Canvas-এর মাধ্যমে অ্যানিমেশন

Canvas অবজেক্টটি সরণযোগ্য। সবকিছু সম্ভব: সরল বলবৎ বলকে থেমানো থেকে শুরু করে জটিল অ্যানিমেশন পর্যন্ত。

HTML Canvas-এর মাধ্যমে ক্রিয়াকর্ম

Canvas-এর মাধ্যমে JavaScript ইভেন্টকে প্রতিক্রিয়া দেওয়া যায়。

Canvas-এর মাধ্যমে কোনও ব্যবহারকারী কর্মকাণ্ড (ক্লিক, মাউস ক্লিক, বাটন ক্লিক, হ্যান্ড গোলা গুলা) করা যায়。

HTML Canvas-এর মাধ্যমে গেম প্লে করা যায়

Canvas-এর অ্যানিমেশন পদ্ধতি HTML গেম অ্যাপ্লিকেশনের জন্য অনেক সম্ভাবনা প্রদান করে。

Canvas Example

HTML-তে, <canvas> এলিমেন্টটি এই মতো দেখাচ্ছে:

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

<canvas> এলিমেন্টটির জন্য id এটিউটম থাকতে হবে, যাতে JavaScript তা উল্লেখ করতে পারে。

width এবং height এটিউটমটি কার্টেজের মাপ নির্ধারণ করার জন্যও অপরিহার্য।

টীকা: একটি HTML পৃষ্ঠায় একাধিক <canvas> এলিমেন্ট থাকতে পারে。

ডিফল্টে, <canvas> এলিমেন্টটি কোনও সীমানা এবং কোনও বিষয় নেই。

সীমানা যোগ করতে, style এটিউটমটি ব্যবহার করুন:

উদাহরণ

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

আপনার নিজের চেষ্টা করুন

আগামী চাপগুলিতে কিভাবে কার্টেজে চিত্রিত করা হবে তা প্রকাশ করা হবে。

আরও দেখুন:

CodeW3C.com-এর সম্পূর্ণ Canvas পরিচ্ছন্ন হান্ডবুক

ব্রাউজার সমর্থন

<canvas> এলিমেন্টটি একটি HTML5 প্রমাণপত্র (2014)।

সমস্ত সাময়িক ব্রাউজারগুলি <canvas> সমর্থন করেন: