উত্তর:
ক্যানভ্যাসগুলি ডিফল্টরূপে স্বচ্ছ।
পৃষ্ঠার পটভূমি চিত্রটি সেট করার চেষ্টা করুন এবং তারপরে এটি একটি ক্যানভাস রাখুন। যদি ক্যানভাসে কিছু আঁকেন না, আপনি পৃষ্ঠার পটভূমি পুরোপুরি দেখতে পাবেন।
একটি কাঁচের প্লেটে পেইন্টিংয়ের মতো ক্যানভাসটি ভাবেন।
আমি বিশ্বাস করি যে আমি ঠিক যা করার চেষ্টা করেছি আপনি ঠিক সেভাবে চেষ্টা করার চেষ্টা করছেন: আমি দুটি স্ট্যাকড ক্যানভ্যাস চাই ... নীচের অংশে একটি স্থির চিত্র রয়েছে এবং উপরের অংশে অ্যানিমেটেড স্প্রিট রয়েছে। অ্যানিমেশনটির কারণে, প্রতিটি নতুন ফ্রেমের রেন্ডারিংয়ের সময় আপনার শীর্ষ স্তরের পটভূমি স্বচ্ছ হতে হবে। অবশেষে আমি উত্তরটি পেয়েছি: এটি গ্লোবালআল্ফা ব্যবহার করছে না, এবং এটি আরজিবা () রঙ ব্যবহার করছে না। সহজ, কার্যকর উত্তর:
context.clearRect(0,0,width,height);যদি আপনি কোনও নির্দিষ্টকে <canvas id="canvasID">সর্বদা স্বচ্ছ হতে চান তবে আপনাকে কেবল সেট করতে হবে
#canvasID{
opacity:0.5;
}পরিবর্তে, আপনি যদি ক্যানভাস অঞ্চলের অভ্যন্তরের কিছু নির্দিষ্ট উপাদানগুলি স্বচ্ছ হতে চান তবে আপনার আঁকানোর সময় স্বচ্ছতা নির্ধারণ করতে হবে, অর্থাত্
context.fillStyle = "rgba(0, 0, 200, 0.5)";opacityক্যানভাসে কোনও পটভূমি ভরাট হলে পরিবর্তনগুলির কোনও প্রভাব থাকবে না।
স্রেফ ক্যানভাসের পটভূমি সেট করুন to
#canvasID{
background:transparent;
}তৃতীয় ক্যানভাসে আপনার দুটি ক্যানভাসে রঙ করুন।
আমারও একই সমস্যা ছিল এবং এখানকার কোনও সমাধানই আমার সমস্যার সমাধান করেনি। আমার উপরে একটি স্বচ্ছ ক্যানভাস ছিল যার উপরে অন্য স্বচ্ছ ক্যানভাস রয়েছে। অস্বচ্ছ ক্যানভাসটি সম্পূর্ণ অদৃশ্য ছিল তবে পৃষ্ঠার মূল পৃষ্ঠার পটভূমি দৃশ্যমান ছিল। উপরে স্বচ্ছ ক্যানভাস থেকে অঙ্কিত দৃশ্যমান ছিল যখন এর নীচে অস্বচ্ছ ক্যানভাসটি ছিল না।
শেষ উত্তরটি মন্তব্য করতে পারবেন না তবে সমাধানটি তুলনামূলকভাবে সহজ। কেবল আপনার অস্বচ্ছ ক্যানভাসের পটভূমি রঙ সেট করুন:
#canvas1 { background-color: black; } //opaque canvas
#canvas2 { ... } //transparent canvasআমি নিশ্চিত নই তবে দেখে মনে হচ্ছে পটভূমির রঙটি দেহ থেকে স্বচ্ছ হিসাবে উত্তরাধিকার সূত্রে প্রাপ্ত।