JavaScript හි canvas සමඟ ආරම්භ කිරීම

Canvas යනු බ්‍රවුසරයේ JavaScript මත ඇඳීම සඳහා විශේෂ ක්ෂේත්‍රයකි. මෙම ක්ෂේත්‍රය සාදන්නේ <canvas> ටැගය භාවිතා කරමිනි, එයට පළල සහ උස සඳහන් කළ යුතුය:

html<canvas width="200" height="200"></canvas>

JavaScript මත මෙම ක්ෂේත්‍රය සමඟ වැඩ කිරීම සඳහා පළමුව ටැගය වෙත සබැඳියක් විචල්‍යයකට ගන්න:

javascriptlet canvas = document.querySelector('canvas');

ඉන්පසු මෙම විචල්‍යයට getContext ක්‍රමය යොදන්න:

javascriptlet canvas = document.querySelector('canvas');
let ctx    = canvas.getContext('2d');

සරල කළ හැකිය:

javascriptlet ctx = document.querySelector('canvas').getContext('2d');

එහි ප්‍රතිඵලයක් ලෙස ctx විචල්‍යයට ක්‍රියාත්මක කිරීමේ සන්දර්භය ලෙස හඳුන්වන දේ අඩංගු වස්තුවක් ලියා ඇත. සියලු ඇඳීම් සිදුවන්නේ මෙම වස්තුවේ ක්‍රම භාවිතා කරමිනි. ඒවා අධ්‍යයනය කිරීම අපි ඊළඟ පාඩම්වලදී කරන්නෙමු.