Chloromaps.com helps non-programmers build choropleth visualizations. It has more than 20+ Maps of countries and continents based on Mercator, Robinson projections.

This is also an Open-source alternative to Mapchart.net 🥳

Motivation

When I was 17 back in 2019 I created an Instagram page called @maps_affinity during my summer break. I used to curate and post content around choropleth visualizations. I used to use other 3rd part software like mapchart to curate those maps. Always wanted to build my version of it but I wasn't programming back then.

Started programming in 2020 May, at this point the page grew to over 19,000+ followers and had hit 1million+ impressions. I tried and failed twice to build it. Nevertheless, I am glad I don't get disappointed by my failure and instead take breaks and move on.

After failing to build it twice and I finally shipped Chloromaps.com, the product I wanted to build since 2019. It’s really beautiful to see an idea becoming a live product all it needs is a lot of consistent efforts.

Have written a detailed blog on my entire journey of building this -> Gaining 19,000+ followers and building my dream project chloromaps.com

Key features

• Mercator, Lambert Azimuthal Equal-area, Robinson Map projection
• 29 Maps of countries, continents, and world
• Saving and loading map configurations
• Generating maps components via CLI
• "Forking" examples of maps

Available Maps (29)

• World 🌎
• World Mercator 🌏
• India 🇮🇳
• Usa 🇺🇸
• Europe 🇪🇺 (Detailed)
• Europe 🇪🇺
• China 🇨🇳
• Russia 🇷🇺
• UK 🇬🇧
• Germany 🇩🇪
• USA 🇺🇸 (Counties)
• France 🇫🇷 (Regions)
• Brazil 🇧🇷
• Australia 🇦🇺
• Pacific-World 🌎
• Canada 🇨🇦
• Poland 🇵🇱
• Spain 🇪🇸
• Turkey 🇹🇷
• Argentina 🇦🇷
• Japan 🇯🇵
• Nigeria 🇳🇬
• Africa 🌍
• Sweden 🇸🇪
• Egypt 🇪🇬
• South Korea 🇰🇷
• France 🇫🇷 (Departments)
• Mexico 🇲🇽
• Italy 🇮🇹

Contributing

Although I no longer plan to mantain this project, feel free to fork, create issues, submit PRs (would be happy to review).

Setup

# install packages
yarn

# run dev server
yarn dev

Acknowledgement

Chloromaps would never be possible without the availability of Amazing Libraries and the Support of some People. Chloromaps take a lot of design inspiration from Vercel and uses Geist a library I contribute to ✨.

Libraries and Frameworks Used in the Development

• React
• TypeScript
• NextJS
• Styled-JSX
• Geist-UI
• Jotai
• MDX
• React-Colorful
• Next-SEO
• Inter
• React-Tooltip
• Preact (Production Build)
• Vercel (CI , Deployments , Hosting)

SVG Maps

• Simple Maps
• Wikipedia's Blank Maps

Things that can be improved

• Tabs, Modals, Popover should follow Aria guidelines
• Styling solution could have been better
• All maps could have been generalised inside /map/[slug] route