Map Image Drill-Down
Map image drill-down is a typical scenario for widely used functionality such as “store locator” and alike.
This demo shows multiple aspects of complex map solution:
- External data with post-processing.
- Multiple map image series.
- Event handling with API manipulations toggling series and controlling map zoom.
- Heat rule functionality.
Click on any bubbles for drill-down effect.
Related tutorials
Build this chart with AI
The prompt below can be used to build this chart with AI. For best coding results, use the most advanced AI models, like Claude Opus 4.6 and GPT-5.3-Codex. For more info and tips, check out amCharts AI docs.
Create a three-tier hierarchical drill-down map of the United States showing store locations. At the national level, display aggregated store counts by state as dark circles with white numeric labels inside, sized based on count. Clicking a state zooms to that state and shows individual city-level markers. Clicking a city marker zooms further to show specific store locations. Load store data from an external JSON file containing latitude, longitude, state codes, city names, and store counts. Apply a teal hover color on state polygons. Show a styled 'Zoom out' button after drilling down to navigate back to the national view. Use the Albers USA projection. Use amCharts 5 library.
Demo source