6cb4398f3a
## Changelog ### New Features - Modularized 3D earth HTML page from single 1918-line file into ES Modules - Split CSS into separate module files (base, info-panel, coordinates-display, legend, earth-stats) - Split JS into separate modules (constants, utils, ui, earth, cables, controls, main) ### 3D Earth Rendering - Use Three.js r128 (via esm.sh CDN) for color consistency with original - Earth with 8K satellite texture and proper material settings - Cloud layer with transparency and additive blending - Starfield background (8000 stars) - Latitude/longitude grid lines that rotate with Earth ### Cable System - Load cable data from geo.json with great circle path calculation - Support for MultiLineString and LineString geometry types - Cable color from geo.json properties.color field - Landing points loading from landing-point-geo.geojson ### User Interactions - Mouse hover: highlight cable and show details - Mouse click: lock cable with pulsing glow effect - Click cable to pause rotation, click elsewhere to resume - Click rotation toggle button to resume rotation and clear highlight - Reset view with smooth animation (800ms cubic ease-out) - Mouse wheel zoom support - Drag to rotate Earth ### UI/UX Improvements - Tooltip shows latitude, longitude, and altitude - Prevent tooltip text selection during drag - Hide tooltip during drag operation - Blue border tooltip styling matching original - Cursor changes to grabbing during drag - Front-facing cable detection (only detect cables facing camera) ### Bug Fixes - Grid lines now rotate with Earth (added as Earth child) - Reset view button now works correctly - Fixed camera reference in reset view - Fixed autoRotate state management when clearing locked cable ### Original HTML - Copied original 3dearthmult.html to public folder for reference
31 lines
539 B
JavaScript
31 lines
539 B
JavaScript
// constants.js - Global constants and configuration
|
|
|
|
// Scene configuration
|
|
export const CONFIG = {
|
|
defaultCameraZ: 300,
|
|
minZoom: 0.5,
|
|
maxZoom: 5.0,
|
|
earthRadius: 100,
|
|
rotationSpeed: 0.002,
|
|
};
|
|
|
|
// Paths
|
|
export const PATHS = {
|
|
geoJSON: './geo.json',
|
|
};
|
|
|
|
// Cable colors mapping
|
|
export const CABLE_COLORS = {
|
|
'Americas II': 0xff4444,
|
|
'AU Aleutian A': 0x44ff44,
|
|
'AU Aleutian B': 0x4444ff,
|
|
'default': 0xffff44
|
|
};
|
|
|
|
// Grid configuration
|
|
export const GRID_CONFIG = {
|
|
latitudeStep: 10,
|
|
longitudeStep: 30,
|
|
gridStep: 5
|
|
};
|