Create a realistic 3D model of a cricket pitch and some field area around it using Three.js. The final view should include the following key elements:
Ground/Pitch:
A large circular grass field with a well-marked cricket pitch in the center.
Add stumps and crease markings on the pitch.
Use a green texture for the field and a brownish texture for the pitch strip. Use white color for crease markings on either end of pitch. Use blue color for stumps on each end of pitch.
Use the following dimensions for the cricket pitch
const PITCH_LENGTH = 20.12;
const PITCH_WIDTH = 3.05;
const STUMP_HEIGHT = 0.7112; // 28 inches
const STUMP_RADIUS = 0.019; // Standard radius
const STUMP_SPREAD = 0.2286; // 9 inches total width
const POPPING_CREASE = 1.22; // 4 feet from bowling crease
const RETURN_CREASE = 1.32; // 4 feet 4 inches from center
const BOWLING_CREASE_LEN = 2.64;
Camera Controls:
Use OrbitControls to allow the user to rotate around and zoom in/out of the stadium. Allow panning of image also.
Lighting and Sky:
Add ambient and directional lighting for daytime environment.
Include a blue skybox or sky dome to simulate daylight.
The scene should be optimized for performance, using low-poly models and compressed textures where possible."