@font-face এর মাধ্যমে লোড করা টাইপফেস সহ ক্যানভাসে পাঠ্য অঙ্কন করলে প্রথমে সঠিকভাবে পাঠ্য দেখায় না। কারণ ব্রাউজার এখনও নেটওয়ার্ক থেকে ফন্ট লোড করেনি। অতএব, এটি ফন্ট ব্যবহার করে, যা ইতিমধ্যে উপলব্ধ।
ফন্ট ব্যবহার করার আগে লোড সম্পূর্ণ করতে হবে। এটি
ট্যাগ ব্যবহার করে নিশ্চিত করা যেতে পারে। আপনি যদি নিশ্চিত করতে চান যে ফন্টটি উপলব্ধ আছে এবং কিছু অন্যান্য উপাদান আগে থেকে লোড করা আছে, তাহলে আপনি
নিচের মত ট্যাগ ব্যবহার করে এটি করতে পারেন।
<div style="font-family: PressStart;"></div>
আপনি এই মত ফন্ট লোড করতে পারেন -
var newFont = new FontFace(‘New Font', 'url(https://samplefont.woff2)');
newFont.load().then(function(font){
document.fonts.add(font);
alert('Font successfully loaded!');
}); 