songsummer920-dazzle/three-scope-map-skill

This repository contains a Codex skill called three-scope-map. The skill is a bundle of instructions, scripts, and a Vue template that lets the Codex coding agent build a 3D map for a web dashboard using Three.js and real GeoJSON data. The README is bilingual, with English prose and Chinese prompts. The skill covers five scopes of map: world, country, province, city, and district. Apart from district, each scope supports drilldown into the next level, so a user can click into a country, then a province, then a city. The visual style is what the README calls dark HUD: dark background, accent colours, extruded geometry, gradient sides, terrain textures, outer contour outlines, labels, scatter points, ripple effects, fly lines, hover lift, and a base ring. A theme generator can derive the full colour set from one main colour. Inside the skill is a one-to-one Vue 3 template based on a validated smart-mine dashboard map. The README recommends pointing Codex at this template first rather than asking it to invent a new map component, and gives a sentence to paste into the prompt to enforce that. To change region, only the GeoJSON, labels, terrain scope, fly-line endpoints, drilldown registry, and camera config need replacing. The skill ships several helper scripts in Python. They validate or download GeoJSON, validate or generate terrain textures, generate and apply a theme from one colour, recolour the bundled label SVG, preprocess GeoJSON for smoother runtime rendering, and check that a target project has the required Vue, Vite, and Three.js setup plus the copied template files. Install is by copying the three-scope-map folder into ~/.codex/skills/. The README provides Chinese prompt templates for two cases: starting from an empty folder, where the agent should set up a Vue 3 plus Vite plus TypeScript project from scratch, and adding the 3D map to an existing app. The notes ask users to confirm GeoJSON and texture data licences before any commercial use.