apache / apache/echarts

[Question] How to load and use country-level GeoJSON maps in ECharts?

Open
#20,889 2 comments 0 reactions 0 assignees View on GitHub
en new-feature pending
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

Hi team 👋

I'm building an ECharts-based map interface in a React app and looking for guidance on how to:

1. Get the appropriate GeoJSON files (e.g., for countries like India or the USA). Is there a way we can fetch GeoJSON files dynamically, from a source that provides it for all countries?
2. Dynamically load these into the chart
3. Add `mappoint` series for city markers (based on lat/lon)
4. Optionally implement clustering based on zoom

I came across the `echarts-countries-js` package, which seems useful — but I wasn't sure if that's the recommended approach or if there's an official source for GeoJSON files.

Are there any example implementations (e.g., on CodeSandbox/CodePen) that I could look at?

Thanks a lot in advance for any help 🙏

### Summary:

1. Where to find the official or recommended GeoJSON files for different countries?
2. How to load these GeoJSON files dynamically (e.g., on zoom or click)?
3. Are there any examples (like on CodeSandbox or CodePen) that show:
- Loading GeoJSON dynamically
- Adding map points
- Possibly clustering markers based on zoom

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.