یک صفحه وب با Three.js بسازید که یک مکعب سهبعدی با رنگهای مختلف روی هر وجه را در مرکز صحنه نمایش دهد، نورپردازی ساده داشته باشد و مکعب بهطور پیوسته بچرخد.
20.0 بازدید آخرین ویرایش در 198 روز قبل ساعت 03:41 0.0
برای حل: از کتابخانه Three.js (با CDN) استفاده کنید؛ یک Scene، دوربین PerspectiveCamera و WebGLRenderer بسازید و renderer را به DOM اضافه کنید. یک BoxGeometry و آرایهای از Materialها (هر وجه رنگ متفاوت) ایجاد کنید و Mesh را بسازید، سپس AmbientLight و یک DirectionalLight اضافه کنید. با تابع animate و requestAnimationFrame، چرخش مکعب را در هر فریم بهروز کنید و با window.resize اندازه رندر را تنظیم کنید. نکات: میتوانید از OrbitControls برای کنترل دوربین استفاده کنید و مراقب نسخه Three.js باشید تا نحوه ارسال آرایه Materialها به Mesh سازگار باشد.
توسط پژوهشگر در 198 روز قبل ساعت 03:41 1 پاسخ
جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من
در حال بارگیری...
برای ارسال پاسخ باید با حساب کاربری وارد شوید.
ورود به حساب کاربری
برای اجرای پایدار مطمئن شوید که نسخه Three.js CDN با نحوه ارسال آرایه Materialها سازگار است (در نسخههای جدید BoxGeometry از گروهها برای هر وجه پشتیبانی میکند و میتوانید یک آرایه Material به Mesh بدهید). از OrbitControls در examples/jsm/controls استفاده کنید تا کاربر دوربین را بچرخاند و هنگام ساخت renderer از antialias و setPixelRatio(window.devicePixelRatio) استفاده کنید. برای نورپردازی ساده یک AmbientLight و یک DirectionalLight اضافه کنید و در صورت نیاز shadows را فعال کنید. فراموش نکنید تابع resize را با window.addEventListener('resize', ...) ثبت کنید تا هنگام تغییر اندازه صفحه رندر صحیح بماند.
گزارش