3D graphics | BestHub

Rare Earth Juejin Tech Community

Mar 22, 2025 · Frontend Development

Recreating Genshin Impact Moon Scene with Three.js – A Step‑by‑Step Tutorial

This article walks through recreating Genshin Impact’s Moon scene using Three.js, covering asset extraction, background loading, star field generation with custom shaders, concentric ring creation, axis stars, camera grouping, and performance optimizations, complete with full source code and live demo links.

3D graphicsFrontend TutorialGenshin Impact

0 likes · 10 min read

Recreating Genshin Impact Moon Scene with Three.js – A Step‑by‑Step Tutorial

Rare Earth Juejin Tech Community

Jul 25, 2024 · Game Development

Building a First‑Person Shooting Game with Three.js

This tutorial walks through creating a complete first‑person shooter in the browser using Three.js, covering scene setup, floor and lighting, random moving targets, player controls, shooting mechanics, bullet physics, hit detection, explosion effects, and the main animation loop.

3D graphicsFirst-Person ShooterGame development

0 likes · 16 min read

Building a First‑Person Shooting Game with Three.js

Rare Earth Juejin Tech Community

May 26, 2024 · Frontend Development

Step‑by‑Step Ocean Simulation with three.js

This tutorial walks readers through building a realistic, animated ocean scene in three.js, covering project initialization, geometry creation, custom shaders, wave calculations, and dynamic boat positioning and rotation using JavaScript and WebGL techniques.

3D graphicsOcean simulationShader

0 likes · 13 min read

Step‑by‑Step Ocean Simulation with three.js

Test Development Learning Exchange

Apr 22, 2024 · Big Data

Mayavi, Matplotlib, and Plotly for 3D Data Visualization in Python

This content introduces Mayavi, Matplotlib, and Plotly as Python libraries for 3D data visualization, providing code examples for creating surface plots, scatter plots, and interactive charts, with a focus on handling large-scale scientific datasets.

3D graphicsMatplotlibMayavi

0 likes · 2 min read

Mayavi, Matplotlib, and Plotly for 3D Data Visualization in Python

Python Programming Learning Circle

Feb 24, 2024 · Fundamentals

Creating a 3D Lantern with Python: Step‑by‑Step Tutorial

This tutorial demonstrates how to use Python with NumPy, Pillow, and the wxgl library to generate a 3D lantern model by loading a paper texture, constructing a cylindrical skeleton, mapping the texture onto it, and rendering the final lantern with optional decorative elements.

3D graphicsNumPypillow

0 likes · 6 min read

Creating a 3D Lantern with Python: Step‑by‑Step Tutorial

ByteFE

Jul 17, 2023 · Frontend Development

Understanding WebGL, Its Frameworks, and Performance Optimization Strategies

This article explains what WebGL is, surveys popular 2D and 3D JavaScript frameworks, analyzes large‑scene performance bottlenecks, and presents concrete optimization techniques such as custom GeoJSON compression, fragment reduction, draw‑call batching, mesh merging, LOD, face culling, and Web Workers, concluding with a brief overview of the emerging WebGPU API.

3D graphicsFrontend DevelopmentPerformance Optimization

0 likes · 24 min read

Understanding WebGL, Its Frameworks, and Performance Optimization Strategies

Python Programming Learning Circle

Jul 6, 2022 · Game Development

Introduction to Vizard: Loading Avatars, Random Walk, Character Actions, and Mouse Interaction

This article introduces Vizard, a C/C++‑based virtual‑reality development platform with Python bindings, and demonstrates how to load avatars and objects, implement a random‑walk pigeon, create talking characters, handle character movement via keyboard, capture mouse motion, and combine these techniques into a functional VR scene.

3D graphicsGame developmentPython

0 likes · 6 min read

Introduction to Vizard: Loading Avatars, Random Walk, Character Actions, and Mouse Interaction

Kuaishou Tech

Mar 21, 2022 · Game Development

Implementing Transform Animation via Virtual Joints in Kuaishou Y‑Tech FBX Export System

This article explains how to convert Transform animations into skinning animations by creating virtual joints, detailing the FBX export workflow, mesh data extraction, joint binding, and animation generation, and discusses hierarchy handling and vertex offset correction for accurate 3D effects.

3D graphicsFBX ExportGame development

0 likes · 9 min read

Implementing Transform Animation via Virtual Joints in Kuaishou Y‑Tech FBX Export System

IT Xianyu

Feb 11, 2022 · Frontend Development

Building a Winter Olympics 3D Web Page with Three.js and React

This article demonstrates how to build an interactive Winter Olympics-themed 3D web page using Three.js and React, covering model loading, custom materials, lighting, particle effects, and camera controls, with detailed code snippets and explanations for each component.

3D graphicsReactThree.js

0 likes · 19 min read

Building a Winter Olympics 3D Web Page with Three.js and React

Sohu Tech Products

Feb 9, 2022 · Frontend Development

Creating a Winter Olympics 3D Scene with Three.js and React

This article demonstrates how to build an interactive 3D Winter Olympics themed webpage using Three.js and React, covering resource import, scene setup, lighting, model loading, custom materials, particle effects, camera controls, and animation techniques.

3D graphicsFrontend DevelopmentReact

0 likes · 18 min read

Creating a Winter Olympics 3D Scene with Three.js and React

政采云技术

Aug 10, 2021 · Frontend Development

WebGL Concepts and Fundamentals

This article introduces WebGL, covering its definition, history, basic concepts, working principles, and practical examples of drawing shapes using both native WebGL API and the Three.js framework.

3D graphics3D web developmentFragment Shader

0 likes · 17 min read

Zhengtong Technical Team

Apr 17, 2020 · Frontend Development

Creating a 3D Orbit Visualization Component

This article details the technical process of creating a 3D visualization component for city management systems, covering HTML structure, CSS animations, and mathematical calculations for distributing elements on a circular path.

3D graphicsCSS animationComponent Design

0 likes · 11 min read

Creating a 3D Orbit Visualization Component

AntTech

Apr 3, 2020 · Frontend Development

Optimizing 3D WebGL Performance for Alipay's Spring Red Envelope Project

During Alipay's massive Spring Red Envelope campaign, the frontend team introduced WebGL 3D scenes and particle effects, tackling memory, transmission size, and rendering performance through model reduction, texture compression, GLB packaging, progressive loading, and GPU‑based particle optimizations to achieve stable, low‑latency user experiences.

3D graphicsParticle SystemsPerformance Optimization

0 likes · 19 min read

Optimizing 3D WebGL Performance for Alipay's Spring Red Envelope Project