Map Studio

A desktop app for turning NASA Blue Marble satellite imagery into stylized 2D maps and 3D globes, then exporting them as high-resolution PNG/TIFF.

Built with Electron, React 19, TypeScript and Vite. 2D rendering uses the HTML Canvas; the 3D globe uses three.js.

Features

• Load NASA GIBS Blue Marble maps at multiple resolutions (large sizes are fetched as tiles and stitched), or import a local image
• 2D canvas view and an interactive 3D globe view
• Image adjustments: brightness, contrast, saturation, vibrance, hue
• Water styling: sea color, tint, coast blur, shallow reveal
• Overlays: coastlines, country borders, height shading
• 16:9 export frame with fit / fill / stretch helpers
• Export PNG/TIFF at several sizes
• Session settings and the last image are auto-saved and restored

Prerequisites

• Node.js 20.19+ (22.12+ recommended; developed on Node 24)
• npm (ships with Node.js)

Setup

npm install

Run the desktop app (Electron)

npm run dev

This starts the Vite dev server and launches the Electron window once it is ready. The desktop build is recommended because it fetches NASA imagery through the Electron main process (avoiding browser CORS limits) and uses a native "Save As" dialog for exports.

Run in the browser only

npm run dev:web

Then open http://127.0.0.1:5173. Note: in a plain browser, NASA tile requests may be blocked by CORS, and exports fall back to a normal file download instead of a native save dialog.

Build

npm run build

Type-checks and bundles the renderer (tsc + Vite → dist/) and compiles the Electron main/preload (tsc → dist-electron/).

Other scripts

• npm run lint — run ESLint
• npm run preview — preview the production web build

Project structure

• src/App.tsx — main UI and application state
• src/components/GlobeView.tsx — three.js globe view
• src/lib/ — canvas renderer, geo paths, map sources, persistence
• src/data/ — prebuilt lake-mask paths
• electron/ — Electron main process and the window.mapStudio preload bridge

Data

Map imagery comes from NASA GIBS (Blue Marble), a public service that requires no API key.