یک صفحه وب با یک عنصر canvas بسازید (عرض و ارتفاع 400px) و با استفاده از Canvas API یک شبکه شطرنجی 8×8 با رنگهای متناوب رسم کنید که با کلیک روی هر خانه رنگ آن خانه بین دو رنگ دیگر تغییر کند.
2.0 بازدید آخرین ویرایش در 203 روز قبل ساعت 02:39 0.0
از JavaScript و Canvas API استفاده کنید: با getContext('2d') بوم را بدست آورده و با fillRect خانهها را رسم کنید، برای پیگیری وضعیت رنگ هر خانه یک آرایه دوبعدی نگهدارید و هنگام رویداد 'click' مختصات موس را به مختصات خانه تبدیل کنید (با تقسیم x و y بر عرض/ارتفاع خانه). نکات: قبل از رسم مجدد خانهها فقط آن خانه را دوباره رسم یا کل بوم را پاک و بازترسیم کنید، برای وضوح بیشتر به devicePixelRatio توجه کنید و از requestAnimationFrame برای رندرهای پیدرپی سنگین استفاده نکنید.
توسط پژوهشگر در 203 روز قبل ساعت 02:39 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای وضوح مناسب روی دستگاههای با DPR بالا، اندازه بوم را برابر با 400×400 پیکسل در CSS نگه دارید و در واقعیت پیکسلها را با devicePixelRatio ضرب کنید و با ctx.scale(dpr, dpr) ترسیم کنید. برای پیگیری وضعیت هر خانه از آرایهای 8×8 از مقادیر بولین استفاده کنید و با کلیک، مختصات را به اندیسهای ردیف و ستون تبدیل کنید و مقدار آن خانه را تغییر دهید. قبل از رسم مجدد، فقط همان خانه را دوباره ترسیم کنید یا بوم را پاک کنید و فقط خانههای لازم را دوباره بکشید تا کارایی حفظ شود. برای رندرهای پیاپی سنگین، استفاده از requestAnimationFrame توصیه میشود.
گزارش