আপনি যদি আপনার ওয়েবসাইটে ইন্টারেক্টিভ উপাদান যোগ করতে চান, তাহলে ক্যানভাসের জন্য বিনামূল্যের লাইব্রেরি আপনার কাজকে সহজ করতে পারে। প্রথমে, আসুন আলোচনা করি কিভাবে HTML5 এ একটি ক্যানভাস তৈরি করা যায়।
HTML
আপনি নিম্নলিখিত কোডটি চালানোর চেষ্টা করতে পারেন, যা HTML5
এ একটি ক্যানভাস তৈরি করেউদাহরণ
<!DOCTYPE html> <html> <head> <title>HTML5 Canvas Tag</title> </head> <body> <canvas id = "myCanvas"> </canvas> <script> var c = document.getElementById('myCanvas'); var ctx = c.getContext('2d'); ctx.fillStyle = '#7cce2b'; ctx.fillRect(0,0,300,100); </script> </body> </html>
এখন, আসুন দেখি HTML5-এ ক্যানভাসের জন্য কোন বিনামূল্যের লাইব্রেরিগুলি আপনার ওয়েবসাইটে আশ্চর্যজনক প্রভাব যোগ করতে সাহায্য করতে পারে৷
Fabric.js
Fabric.js হল একটি শক্তিশালী জাভাস্ক্রিপ্ট HTML5 ক্যানভাস লাইব্রেরি, ব্যাপকভাবে ক্যানভাস উপাদানের উপরে ইন্টারেক্টিভ অবজেক্ট মডেল প্রদান করতে ব্যবহৃত হয়।
Fabric.js ব্যবহার করে, ক্যানভাসে অবজেক্ট তৈরি করুন এবং পপুলেট করুন অর্থাৎ সাধারণ জ্যামিতিক আকারের মতো বস্তু। এছাড়াও, একটি আকৃতিকে গ্রেডিয়েন্ট দেওয়া সহজ। সহজে পাঠ্য যোগ করুন এবং গতিশীলভাবে প্রান্তিককরণ, আকার, ইত্যাদি ম্যানিপুলেট করুন।
Paper.js
এটি একটি ওপেন সোর্স ভেক্টর গ্রাফিক্স স্ক্রিপ্টিং ফ্রেমওয়ার্ক, যা HTML5 ক্যানভাসের উপরে চলে৷
Paper.js একটি ডকুমেন্ট অবজেক্ট মডেল প্রদান করে, লেয়ার, গ্রুপ, পাথ ইত্যাদি সহ একটি প্রোজেক্ট সহজে তৈরি এবং পপুলেট করে। পাথ তৈরি করুন এবং সেগুলিতে সেগমেন্ট যোগ করুন। পাথ হল সেগমেন্টের একটি ক্রম যা বক্ররেখা দ্বারা সংযুক্ত।
বিভাগগুলিকে সহজেই পরিদর্শন করা যায়, ম্যানিপুলেট করা যায় এবং যোগ করার পরে ঘুরে দেখা যায়৷ এছাড়াও আপনি সহজেই সেগমেন্টগুলি সরাতে পারেন। এছাড়াও SV
হিসেবে ভেক্টর গ্রাফিক্স আমদানি ও রপ্তানি করার পদ্ধতি পানChart.js
এটি একটি ওপেন সোর্স জাভাস্ক্রিপ্ট লাইব্রেরি, যা 8টি ভিন্ন উপায়ে আপনার ডেটা ভিজ্যুয়ালাইজ করে৷ সমস্ত আধুনিক ব্রাউজার জুড়ে এটির দুর্দান্ত রেন্ডারিং কার্যক্ষমতা রয়েছে। নিখুঁত স্কেল গ্রানুলারিটির জন্য উইন্ডোর আকার পরিবর্তনে সহজেই চার্ট পুনরায় আঁকুন।
Chart.js অন্তর্নির্মিত চার্ট সরবরাহ করে এবং এগুলি সহজেই কাস্টম চার্টে প্রসারিত করা যায়৷ অন্তর্নির্মিত চার্টের মধ্যে রয়েছে লাইন, বার, অনুভূমিক বার, স্ক্যাটার, বাবল ইত্যাদি।