Global Crops & Agriculture

The UN Food and Agriculture Organization (FAO) STAT database is the authoritative global source for agricultural production statistics. The QCL domain covers crop production in tonnes, yield in tonnes per hectare, and area harvested in hectares. This implementation uses a curated static extract of 2022 data for 8 major crops — wheat, rice, maize, soybeans, coffee, cocoa, sugarcane, and cotton — spanning 80+ producing countries, ensuring reliable offline availability without dependency on FAO's legacy HTTP API.

Each crop dataset is normalised independently: the maximum production value for the selected crop becomes 1.0, and all other countries are scaled proportionally. This per-crop normalisation means the colour gradient always spans the full range regardless of absolute production scale — allowing meaningful comparison between high-volume crops like sugarcane (>700M t/yr) and low-volume crops like cocoa (~4M t/yr). Country centroids provide approximate lat/lng for point placement on the globe surface.

Each country is rendered as a glowing sprite particle in a Three.js BufferGeometry point cloud attached directly to the globe.gl scene graph. Point altitude above the globe surface is proportional to the normalised production value, creating a visual 3D bar-chart effect on the sphere. The sprite texture is a radial canvas gradient from bright yellow-green at the centre to transparent at the edges, softened to avoid harsh edges at all viewing distances.

The five-stop green gradient — dark navy (#1a1a2e) for no data, dark forest (#1a5f2a) for low, mid-green (#3d9142), bright green (#7ec850), to yellow-green (#c8f070) for very high — echoes vegetation mapping conventions and distinguishes agricultural intensity at a glance. The gradient is computed client-side by linear interpolation between stop colours, with the normalised value clamped to [0, 1] and mapped through the colour ramp.

Mouse hover and click events are handled by a Three.js Raycaster with a 4-unit point threshold. On hover, a floating tooltip shows the country name and its value for the selected crop/view. On click, the globe animates to centre on the selected country and the sidebar detail panel opens with full statistics: production in thousand tonnes, yield in t/ha, harvested area in thousand ha, and percentage of world total. The top-10 producers leaderboard updates instantly when the crop or view mode changes.