সব আধুনিক ব্রাউজার SVG সমর্থন করে এবং জাভাস্ক্রিপ্ট দিয়ে সহজে তৈরি করা যায়। Google Chrome এবং Firefox দুটোই SVG সমর্থন করে।
জাভাস্ক্রিপ্ট দিয়ে একটি খালি SVG ডকুমেন্ট অবজেক্ট মডেল (DOM) তৈরি করুন। অ্যাট্রিবিউট ব্যবহার করে আকার তৈরি করুন যেমন বৃত্ত বা রেক্ট্যাঙ্গেল।
var mySvg = "https://www.w3.org/2000/svg"; var myDoc = evt.target.ownerDocument; var myShape = svgDocument.createElementNS(mySvg, "circle"); myShape.setAttributeNS(null, "cx", 40); myShape.setAttributeNS(null, "cy", 40); myShape.setAttributeNS(null, "r", 30); myShape.setAttributeNS(null, "fill", "yellow");
ব্যাখ্যা: SVG নেমস্পেস https://www.w3.org/2000/svg। createElementNS দিয়ে SVG এলিমেন্ট তৈরি করতে হয় (সাধারণ createElement কাজ করবে না)। setAttributeNS দিয়ে অ্যাট্রিবিউট সেট করা হয়। সম্পূর্ণ উদাহরণে svgDocument ভেরিয়েবল ডিক্লেয়ার করা নেই — সেটি myDoc বা ডকুমেন্ট অবজেক্ট হতে পারে। আধুনিক পদ্ধতিতে ইনলাইন SVG HTML-এ লিখে JS দিয়ে ম্যানিপুলেট করা সহজ।
