├── .eslintignore ├── .eslintrc ├── .gitignore ├── .prettierignore ├── .prettierrc ├── LICENSE ├── MapData.json ├── README.md ├── assets ├── icons │ ├── ConfigIcon.tsx │ ├── FreeIcon.tsx │ ├── ImageIcon.tsx │ ├── LabelsIcon.tsx │ ├── LegendIcon.tsx │ └── MapIcon.tsx └── logo │ └── Logo.tsx ├── components ├── Banner.tsx ├── Changelog │ ├── Changelog.tsx │ └── data.ts ├── ColorPicker.tsx ├── ColorPickerInput.tsx ├── ControlContainer.tsx ├── Controls │ ├── EditControls.tsx │ ├── ExportControls.tsx │ ├── LabelControls.tsx │ └── LegendAllControls.tsx ├── Footer.tsx ├── HideMapRegions.tsx ├── HorControlContainer.tsx ├── InputLabel.tsx ├── Label │ ├── LabelContainer.tsx │ └── MiniLabelColorPicker.tsx ├── Landing │ ├── FeatureCard.tsx │ ├── FeatureContainer.tsx │ ├── LandingWorldMap.tsx │ ├── MapShowCard.tsx │ └── MapShowContainer.tsx ├── Legend │ ├── LegendContainer.tsx │ ├── LegendControls.tsx │ └── LegendGradient.tsx ├── LoadExample │ └── LoadExample.tsx ├── MapAddons │ └── HideWaterBodies.tsx ├── MapToolBox.tsx ├── MiniColorPicker.tsx ├── Navbar.tsx ├── PaletteBox.tsx └── Seo │ ├── MainSEO.tsx │ └── MapSEO.tsx ├── configs ├── apple_gdp_comp.json ├── europe_democraxy_index.json ├── india.json ├── lgbtq_marriage.json ├── most_searched_wonders.json ├── press_freedom_index.json ├── sweden.json └── usa.json ├── data ├── Africa │ ├── Africa.map.tsx │ └── AfricaStateCodes.ts ├── Argentina │ ├── Argentina.map.tsx │ └── ArgentinaStateCodes.tsx ├── Australia │ ├── Australia.map.tsx │ └── AustraliaStateCodes.ts ├── Azerbaijan │ ├── Azerbaijan.map.tsx │ └── AzerbaijanStateCodes.tsx ├── Brazil │ ├── Brazil.map.tsx │ └── BrazilStateCodes.tsx ├── Canada │ ├── Canada.map.tsx │ └── CanadaStateCodes.tsx ├── China │ ├── China.map.tsx │ └── ChinaStateCodes.tsx ├── Counties │ ├── Counties.map.tsx │ └── CountiesStateCodes.tsx ├── Egypt │ ├── Egypt.map.tsx │ └── EgyptStateCodes.tsx ├── Euro │ ├── Euro.map.tsx │ └── EuroStateCodes.tsx ├── France-Departments │ ├── France.map.tsx │ └── FranceStateCodes.tsx ├── France │ ├── France.map.tsx │ └── FranceStateCodes.tsx ├── India │ ├── India.map.tsx │ └── IndiaStateCode.ts ├── Italy │ ├── Italy.map.tsx │ └── ItalyStateCodes.tsx ├── Japan │ ├── Japan.map.tsx │ └── JapanStateCodes.tsx ├── Korea │ ├── Korea.map.tsx │ └── KoreaStateCodes.tsx ├── Mercator │ ├── Mercator.map.tsx │ └── MercatorStateCodes.tsx ├── Mexico │ ├── Mexico.map.tsx │ └── MexicoStateCodes.tsx ├── Nigeria │ ├── Nigeria.map.tsx │ └── NigeriaStateCodes.tsx ├── Poland │ ├── Poland.map.tsx │ └── PolandStateCodes.tsx ├── Spain │ ├── Spain.map.tsx │ └── SpainStateCodes.tsx ├── Turkey │ ├── Turkey.map.tsx │ └── TurkeyStateCodes.tsx ├── Usa │ ├── Usa.map.tsx │ └── UsaStateCodes.ts ├── World │ ├── World.map.tsx │ └── WorldCountryCodes.ts ├── WorldPacific │ ├── WorldPacific.map.tsx │ └── WorldPacificStateCodes.tsx ├── colors │ └── index.ts ├── europe │ ├── Europe.map.tsx │ └── EuropeCountryCode.tsx ├── germany │ ├── Germany.map.tsx │ └── GermanyStateCodes.ts ├── russia │ ├── Russia.map.tsx │ └── RussiaStateCodes.ts ├── sweden │ ├── Sweden.map.tsx │ └── SwedenStateCode.ts ├── uk │ ├── Uk.map.tsx │ └── UkStateCodes.ts └── version.ts ├── genMapFiles.js ├── hooks ├── use-drag-drop.ts ├── use-drag.ts └── use-render.ts ├── layouts ├── MainLayout.tsx ├── MapLayout.tsx └── PageLayout.tsx ├── lib ├── downloadConfig.ts ├── downloadMap.ts ├── exportLabelData.ts ├── fillAllMap.ts ├── fillColorOnClick.ts ├── getCodesOfColor.ts ├── getColorUsed.ts ├── gtag.js ├── importLabelConfig.ts ├── reOrderArrElements.ts ├── resetFullMap.ts ├── resetMap.ts ├── resolveLegendData.ts └── uploadConfig.ts ├── next-env.d.ts ├── next-seo.config.js ├── next.config.js ├── package.json ├── pages ├── _app.tsx ├── _document.tsx ├── about.mdx ├── acknowledgement.mdx ├── blog.mdx ├── changelog.mdx ├── contact.mdx ├── contributions.mdx ├── demographics.tsx ├── examples.tsx ├── feedback.mdx ├── index.tsx ├── inspiration.mdx ├── license.mdx ├── map │ ├── africa.tsx │ ├── argentina.tsx │ ├── australia.tsx │ ├── azerbaijan.tsx │ ├── brazil.tsx │ ├── canada.tsx │ ├── china.tsx │ ├── egypt.tsx │ ├── europe-detailed.tsx │ ├── europe.tsx │ ├── france-departments.tsx │ ├── france.tsx │ ├── germany.tsx │ ├── india.tsx │ ├── italy.tsx │ ├── japan.tsx │ ├── korea.tsx │ ├── mexico.tsx │ ├── nigeria.tsx │ ├── poland.tsx │ ├── russia.tsx │ ├── spain.tsx │ ├── sweden.tsx │ ├── turkey.tsx │ ├── uk.tsx │ ├── usa-counties.tsx │ ├── usa.tsx │ ├── world-mercator.tsx │ ├── world-pacific.tsx │ └── world.tsx ├── maps.tsx ├── open-source.mdx ├── privacy.mdx ├── terms.mdx └── tutorial.mdx ├── public ├── robots.txt └── static │ ├── favicons │ ├── android-chrome-192x192.png │ ├── android-chrome-512x512.png │ ├── apple-touch-icon.png │ ├── browserconfig.xml │ ├── favicon-16x16.png │ ├── favicon-32x32.png │ ├── favicon.ico │ ├── mstile-144x144.png │ ├── mstile-150x150.png │ ├── mstile-310x150.png │ ├── mstile-310x310.png │ ├── mstile-70x70.png │ └── site.webmanifest │ └── images │ └── global │ ├── banner-2.png │ └── banner.png ├── resources.md ├── store ├── label.store.ts ├── map.store.ts └── theme.store.ts ├── styles └── main.css ├── tsconfig.json ├── typings ├── config.d.ts ├── image.d.ts ├── label.store.d.ts ├── map.store.d.ts ├── svg-as-png.d.ts └── svgmt.d.ts └── yarn.lock /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .eslintrc 3 | next.config.js 4 | blog 5 | snippets 6 | next-seo.config.js 7 | genMapFiles.js -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-console, no-param-reassign */ 2 | /* eslint-disable-next-line no-console*/ 3 | { 4 | "plugins": ["prettier", "@typescript-eslint"], 5 | "extends": ["airbnb-typescript", "react-app", "prettier"], 6 | "parser": "@typescript-eslint/parser", 7 | "parserOptions": { 8 | "project": "./tsconfig.json" 9 | }, 10 | "settings": { 11 | "import/resolver": { 12 | "typescript": { 13 | "alwaysTryTypes": true 14 | } 15 | } 16 | }, 17 | "rules": { 18 | "jsx-a11y/anchor-is-valid": [ 19 | "error", 20 | { 21 | "components": ["Link"], 22 | "specialLink": ["hrefLeft", "hrefRight"], 23 | "aspects": ["invalidHref", "preferButton"] 24 | } 25 | ], 26 | "no-param-reassign": 0, 27 | "object-curly-spacing": ["warn", "always"], 28 | "no-unused-vars": [ 29 | "warn", 30 | { 31 | "vars": "all", 32 | "args": "none" 33 | } 34 | ], 35 | "@typescript-eslint/no-unused-vars": [ 36 | "warn", 37 | { 38 | "vars": "all", 39 | "args": "none" 40 | } 41 | ], 42 | "@typescript-eslint/no-explicit-any": [ 43 | "error", 44 | { 45 | "ignoreRestArgs": true 46 | } 47 | ], 48 | "max-len": "off", 49 | "no-plusplus": [ 50 | "error", 51 | { 52 | "allowForLoopAfterthoughts": true 53 | } 54 | ], 55 | 56 | "react/jsx-key": "error", 57 | "import/no-extraneous-dependencies": "off", 58 | "react/jsx-props-no-spreading": "off", 59 | "import/prefer-default-export": "off", 60 | "react/jsx-boolean-value": "off", 61 | "react/prop-types": "off", 62 | "react/no-unescaped-entities": "off", 63 | "react/jsx-one-expression-per-line": "off", 64 | "react/jsx-wrap-multilines": "off", 65 | "react/destructuring-assignment": "off", 66 | "@typescript-eslint/comma-dangle": [ 67 | "error", 68 | { 69 | "arrays": "only-multiline", 70 | "objects": "only-multiline", 71 | "imports": "only-multiline", 72 | "exports": "only-multiline", 73 | "functions": "never" 74 | } 75 | ] 76 | } 77 | } 78 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | .next 4 | temp -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": true, 3 | "tabWidth": 4, 4 | "printWidth": 100, 5 | "singleQuote": true, 6 | "trailingComma": "none", 7 | "jsxBracketSameLine": true 8 | } 9 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 onwards Deepankar Bhade 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /MapData.json: -------------------------------------------------------------------------------- 1 | {"version":"v0.2.0-alpha","mapId":"india-map","mapData":{"defaultFillColor":"black","mapStrokeColor":"white","mapBackgroundColor":"black","mapStrokeWidth":"1","mapFillColor":"#ff677d","mapData":[{"fill":"#FFA726","code":"1","hide":false},{"fill":"#FFE0B2","code":"2","hide":false},{"fill":"#F57C00","code":"3","hide":false},{"fill":"#EF6C00","code":"4","hide":false},{"fill":"#FFA726","code":"5","hide":false},{"fill":"#F57C00","code":"6","hide":false},{"fill":"#F57C00","code":"7","hide":false},{"fill":"#EF6C00","code":"8","hide":false},{"fill":"#FF9800","code":"9","hide":false},{"fill":"#FB8C00","code":"10","hide":false},{"fill":"#EF6C00","code":"11","hide":false},{"fill":"#FB8C00","code":"12","hide":false},{"fill":"#FFA726","code":"13","hide":false},{"fill":"#FB8C00","code":"14","hide":false},{"fill":"#FB8C00","code":"16","hide":false},{"fill":"#EF6C00","code":"17","hide":false},{"fill":"#FFA726","code":"18","hide":false},{"fill":"#F57C00","code":"19","hide":false},{"fill":"#FFA726","code":"20","hide":false},{"fill":"#FFF3E0","code":"21","hide":false},{"fill":"#FF9800","code":"22","hide":false},{"fill":"#FFB74D","code":"23","hide":false},{"fill":"#FF9800","code":"24","hide":false},{"fill":"#FFA726","code":"25","hide":false},{"fill":"#FB8C00","code":"26","hide":false},{"fill":"#FFE0B2","code":"27","hide":false},{"fill":"#FFF3E0","code":"28","hide":false},{"fill":"#FB8C00","code":"29","hide":false},{"fill":"#FFE0B2","code":"30","hide":false},{"fill":"#FFF3E0","code":"31","hide":false},{"fill":"#E65100","code":"32","hide":false},{"fill":"#F57C00","code":"33","hide":false},{"fill":"#F57C00","code":"34","hide":false},{"fill":"#FFA726","code":"35","hide":false},{"fill":"#FFA726","code":"36","hide":false},{"fill":"#FFB74D","code":"37","hide":false},{"fill":"#F57C00","code":"38","hide":false}],"legendData":[{"fill":"#FFF3E0","text":"0","hide":false},{"fill":"#FFE0B2","text":"10","hide":false},{"fill":"#FFCC80","text":"20","hide":false},{"fill":"#FFB74D","text":"30","hide":false},{"fill":"#FFA726","text":"40","hide":false},{"fill":"#FF9800","text":"50","hide":false},{"fill":"#FB8C00","text":"60","hide":false},{"fill":"#F57C00","text":"70","hide":false},{"fill":"#EF6C00","text":"80","hide":false},{"fill":"#E65100","text":"90","hide":false}],"legendTextColor":"white","hideStates":[],"hideLegend":false,"legendSmoothGradient":false,"hideSource":false,"sourceText":"Source: NYIMES"},"labelData":{"data":[],"scalingFactor":1.67}} -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![Chloromaps Banner](https://chloromaps.vercel.app/static/images/global/banner.png) 2 | 3 | [Chloromaps.com](https://chloromaps.com/) helps non-programmers build choropleth visualizations. It has more than 20+ Maps of countries and continents based on Mercator, Robinson projections. 4 | 5 | > This is also an Open-source alternative to Mapchart.net 🥳 6 | 7 | ## Motivation 8 | 9 | When I was 17 back in 2019 I created an Instagram page called [@maps_affinity](https://www.instagram.com/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. 10 | 11 | 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. 12 | 13 | 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. 14 | 15 | > Have written a detailed blog on my entire journey of building this -> [Gaining 19,000+ followers and building my dream project chloromaps.com](https://dpnkr.in/blog/building-maps-affinity-and-chloromaps) 16 | 17 | ## Key features 18 | 19 | - Mercator, Lambert Azimuthal Equal-area, Robinson Map projection 20 | - 29 Maps of countries, continents, and world 21 | - Saving and loading map configurations 22 | - [Generating maps components via CLI](https://twitter.com/DeepankarBhade/status/1398129689139421184) 23 | - ["Forking" examples of maps](https://twitter.com/DeepankarBhade/status/1399021820615876611) 24 | 25 | ## Available Maps (29) 26 | 27 | - [World 🌎](https://chloromaps.com/map/world) 28 | - [World Mercator 🌏](https://chloromaps.com/map/world-mercator) 29 | - [India 🇮🇳](https://chloromaps.com/map/india) 30 | - [Usa 🇺🇸](https://chloromaps.com/map/usa) 31 | - [Europe 🇪🇺 (Detailed)](https://chloromaps.com/map/europe-detailed) 32 | - [Europe 🇪🇺](https://chloromaps.com/map/europe) 33 | - [China 🇨🇳](https://chloromaps.com/map/china) 34 | - [Russia 🇷🇺](https://chloromaps.com/map/russia) 35 | - [UK 🇬🇧](https://chloromaps.com/map/uk) 36 | - [Germany 🇩🇪](https://chloromaps.com/map/germany) 37 | - [USA 🇺🇸 (Counties)](https://chloromaps.com/map/usa-counties) 38 | - [France 🇫🇷 (Regions)](https://chloromaps.com/map/france) 39 | - [Brazil 🇧🇷](https://chloromaps.com/map/brazil) 40 | - [Australia 🇦🇺](https://chloromaps.com/map/australia) 41 | - [Pacific-World 🌎](https://chloromaps.com/map/world-pacific) 42 | - [Canada 🇨🇦](https://chloromaps.com/map/canada) 43 | - [Poland 🇵🇱](https://chloromaps.com/map/poland) 44 | - [Spain 🇪🇸](https://chloromaps.com/map/spain) 45 | - [Turkey 🇹🇷](https://chloromaps.com/map/turkey) 46 | - [Argentina 🇦🇷](https://chloromaps.com/map/argentina) 47 | - [Japan 🇯🇵](https://chloromaps.com/map/japan) 48 | - [Nigeria 🇳🇬](https://chloromaps.com/map/nigeria) 49 | - [Africa 🌍](https://chloromaps.com/map/africa) 50 | - [Sweden 🇸🇪](https://chloromaps.com/map/sweden) 51 | - [Egypt 🇪🇬](https://chloromaps.com/map/egypt) 52 | - [South Korea 🇰🇷](https://chloromaps.com/map/korea) 53 | - [France 🇫🇷 (Departments)](https://chloromaps.com/map/france-departments) 54 | - [Mexico 🇲🇽](https://chloromaps.com/map/mexico) 55 | - [Italy 🇮🇹](https://chloromaps.com/map/italy) 56 | 57 | ## Contributing 58 | 59 | Although I no longer plan to mantain this project, feel free to fork, create issues, submit PRs (would be happy to review). 60 | 61 | ### Setup 62 | 63 | ```bash 64 | # install packages 65 | yarn 66 | 67 | # run dev server 68 | yarn dev 69 | ``` 70 | 71 | ## Acknowledgement 72 | 73 | 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](https://github.com/geist-org/geist-ui) a library I contribute to ✨. 74 | 75 | ### Libraries and Frameworks Used in the Development 76 | 77 | - [React](https://github.com/facebook/react) 78 | - [TypeScript](https://github.com/microsoft/TypeScript) 79 | - [NextJS](https://github.com/vercel/next.js) 80 | - [Styled-JSX](https://github.com/vercel/styled-jsx) 81 | - [Geist-UI](https://github.com/geist-org/react) 82 | - [Jotai](https://github.com/pmndrs/jotai) 83 | - [MDX](https://github.com/mdx-js/mdx) 84 | - [React-Colorful](https://github.com/omgovich/react-colorful) 85 | - [Next-SEO](https://github.com/garmeeh/next-seo) 86 | - [Inter](https://github.com/rsms/inter) 87 | - [React-Tooltip](https://github.com/wwayne/react-tooltip) 88 | - [Preact (Production Build)](https://preactjs.com/) 89 | - [Vercel (CI , Deployments , Hosting)](https://vercel.com/) 90 | 91 | ### SVG Maps 92 | 93 | - [Simple Maps](https://simplemaps.com/resources/svg-maps) 94 | - [Wikipedia's Blank Maps](https://en.wikipedia.org/wiki/Wikipedia:Blank_maps) 95 | 96 | ## Things that can be improved 97 | 98 | - Tabs, Modals, Popover should follow Aria guidelines 99 | - Styling solution could have been better 100 | - All maps could have been generalised inside `/map/[slug]` route 101 | -------------------------------------------------------------------------------- /assets/icons/ConfigIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function ConfigIcon(props: React.SVGProps) { 4 | return ( 5 | 11 | 15 | 16 | ); 17 | } 18 | 19 | export default ConfigIcon; 20 | -------------------------------------------------------------------------------- /assets/icons/FreeIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function FreeIcon(props: React.SVGProps) { 4 | return ( 5 | 11 | 15 | 16 | ); 17 | } 18 | 19 | export default FreeIcon; 20 | -------------------------------------------------------------------------------- /assets/icons/ImageIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function ImageIcon(props: React.SVGProps) { 4 | return ( 5 | 11 | 15 | 16 | ); 17 | } 18 | 19 | export default ImageIcon; 20 | -------------------------------------------------------------------------------- /assets/icons/LabelsIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function LabelsIcon(props: React.SVGProps) { 4 | return ( 5 | 11 | 15 | 16 | ); 17 | } 18 | 19 | export default LabelsIcon; 20 | -------------------------------------------------------------------------------- /assets/icons/LegendIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function LegendIcon(props: React.SVGProps) { 4 | return ( 5 | 11 | 15 | 16 | ); 17 | } 18 | 19 | export default LegendIcon; 20 | -------------------------------------------------------------------------------- /assets/icons/MapIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function MapIcon(props: React.SVGProps) { 4 | return ( 5 | 11 | 15 | 16 | ); 17 | } 18 | 19 | export default MapIcon; 20 | -------------------------------------------------------------------------------- /assets/logo/Logo.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Logo = (props: React.SVGProps) => ( 4 | 13 | 14 | 15 | 16 | ); 17 | 18 | export default Logo; 19 | -------------------------------------------------------------------------------- /components/Banner.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Banner = () => { 4 | // const ref = useRef(null); 5 | const showBanner = true; 6 | // const closeBanner = () => { 7 | // if (ref.current !== null) { 8 | // ref.current.remove(); 9 | // } 10 | // }; 11 | return ( 12 | <> 13 | {showBanner ? ( 14 | 25 | ) : null} 26 | 27 | ); 28 | }; 29 | 30 | export default Banner; 31 | 32 | // const CrossIcon = () => ( 33 | // 34 | // 38 | // 39 | // ); 40 | -------------------------------------------------------------------------------- /components/Changelog/Changelog.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { 3 | Tag as TagIcon, 4 | Book as BookIcon, 5 | Tool as ToolIcon, 6 | Package as PackageIcon, 7 | MapPin as MapIcon 8 | } from '@geist-ui/react-icons'; 9 | import { Spacer } from '@geist-ui/react'; 10 | import data from './data'; 11 | 12 | const Changelog = () => ( 13 | <> 14 |
15 | {data.reverse().map((el) => ( 16 |
17 |
18 | 19 | {el.version} 20 | 21 | {el.date} 22 |
23 |
24 | {el.data.map((d) => ( 25 |
26 | {d.type === 'fix' ? : ''} 27 | {d.type === 'map' ? : ''} 28 | {d.type === 'feat' ? : ''} 29 | {d.type === 'docs' ? : ''} 30 | {d.text} 31 |
32 | ))} 33 |
34 |
35 | ))} 36 | 71 |
72 | 73 | ); 74 | 75 | export default Changelog; 76 | -------------------------------------------------------------------------------- /components/Changelog/data.ts: -------------------------------------------------------------------------------- 1 | interface ChangeLogType { 2 | date: string; 3 | data: { 4 | type: 'feat' | 'fix' | 'docs' | 'map'; 5 | text: string; 6 | }[]; 7 | version: string; 8 | } 9 | const changeLogData : ChangeLogType[] = [ 10 | { 11 | date: '1st June 2021', 12 | data: [{ 13 | type: 'feat', 14 | text: 'Releasing Alpha Version for Limited Users' 15 | }], 16 | version: `0.0.0-alpha` 17 | }, 18 | { 19 | date: '1st June 2021', 20 | data: [{ 21 | type: 'feat', 22 | text: 'Export Maps in SVG & PDF Format' 23 | }, 24 | { 25 | type: 'docs', 26 | text: 'Adding Contributions Page' 27 | }, 28 | { 29 | type: 'feat', 30 | text: 'Clicking on Landing Page World Map would route to Country\'s Map to Edit it' 31 | }, 32 | { 33 | type: 'fix', 34 | text: 'Remove Redundant SVG tag' 35 | }, 36 | { 37 | type: 'fix', 38 | text: 'Labels SVG Fill / Stroke Issue' 39 | }, 40 | ], 41 | version: `0.1.0-alpha` 42 | }, 43 | { 44 | date: '3rd June 2021', 45 | data: [{ 46 | type: 'fix', 47 | text: 'Remove Light Mode , add Version Tag' 48 | }, 49 | { 50 | type: 'map', 51 | text: 'Introducing Argentina , Nigeria , Japan' 52 | }, 53 | { 54 | type: 'feat', 55 | text: 'Adding Source Value to Legend' 56 | } 57 | ], 58 | version: `0.2.0-alpha` 59 | }, 60 | { 61 | date: '6th June 2021', 62 | data: [{ 63 | type: 'fix', 64 | text: 'Swap with Preact on Production' 65 | }, 66 | { 67 | type: 'map', 68 | text: 'Introducing Europe Detailed , South Korea , Egypt' 69 | }, 70 | { 71 | type:'fix', 72 | text: 'Merging SVG Paths' 73 | } 74 | ], 75 | version: `0.3.0-alpha` 76 | }, 77 | { 78 | date: '10th June 2021', 79 | data: [{ 80 | type: 'docs', 81 | text: 'New Examples Added' 82 | }, 83 | { 84 | type: 'map', 85 | text: 'France , Italy , USA Counties , World Mercator' 86 | }, 87 | { 88 | type:'feat', 89 | text: 'Highlight Colors Already used in Palette' 90 | } 91 | ], 92 | version: `0.4.0-alpha` 93 | }, 94 | 95 | ] 96 | 97 | export default changeLogData; -------------------------------------------------------------------------------- /components/ColorPicker.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable react/no-array-index-key */ 2 | /* eslint-disable jsx-a11y/no-static-element-interactions */ 3 | /* eslint-disable jsx-a11y/click-events-have-key-events */ 4 | import { colorPickerPalette } from '@/data/colors'; 5 | import React from 'react'; 6 | import { HexColorPicker } from 'react-colorful'; 7 | 8 | interface Props { 9 | color: string; 10 | handleColor: (v: string) => void; 11 | uniquePalette: string[]; 12 | } 13 | 14 | const ColorPicker: React.FC = ({ color, handleColor, uniquePalette }) => ( 15 | <> 16 | 17 |
18 | {colorPickerPalette.map((d, i) => ( 19 |
20 | {d.map((el) => ( 21 |
handleColor(el)} 23 | key={el} 24 | style={{ backgroundColor: el }} 25 | className={`palette-box my-1 ${ 26 | uniquePalette.includes(el) ? 'border' : '' 27 | }`} 28 | /> 29 | ))} 30 |
31 | ))} 32 | 48 |
49 | 50 | ); 51 | 52 | export default ColorPicker; 53 | -------------------------------------------------------------------------------- /components/ColorPickerInput.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable jsx-a11y/no-static-element-interactions */ 2 | /* eslint-disable jsx-a11y/click-events-have-key-events */ 3 | import { Input, useTheme } from '@geist-ui/react'; 4 | import React from 'react'; 5 | import ColorPicker from './ColorPicker'; 6 | import InputLabel from './InputLabel'; 7 | 8 | interface Props { 9 | placeHolder: string; 10 | color: string; 11 | setColor: (v: string, a: string) => void; 12 | type: string; 13 | uniquePalette: string[]; 14 | } 15 | 16 | const ColorPickerInput: React.FC = ({ 17 | placeHolder, 18 | color, 19 | setColor, 20 | type, 21 | uniquePalette 22 | }) => { 23 | const handleColor = (v: string) => { 24 | setColor(v, type); 25 | }; 26 | const theme = useTheme(); 27 | const [open, setOpen] = React.useState(false); 28 | return ( 29 | <> 30 | 31 |
32 |
setOpen(!open)}> 35 | {open && ( 36 | <> 37 |
38 | 43 |
44 | 45 | )} 46 |
47 | handleColor(e.target.value)} 50 | placeholder={placeHolder} 51 | className="input" 52 | /> 53 | 76 |
77 | 78 | ); 79 | }; 80 | 81 | export default ColorPickerInput; 82 | -------------------------------------------------------------------------------- /components/Controls/EditControls.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-explicit-any */ 2 | import getColorUsed from '@/lib/getColorUsed'; 3 | import { MapStoreType } from '@/typings/map.store'; 4 | import { Input, Spacer, Button } from '@geist-ui/react'; 5 | import { Layers, RefreshCcw } from '@geist-ui/react-icons'; 6 | import React from 'react'; 7 | import ColorPickerInput from '../ColorPickerInput'; 8 | import InputLabel from '../InputLabel'; 9 | import PaletteBox from '../PaletteBox'; 10 | 11 | interface Props { 12 | map: MapStoreType; 13 | handleAttrChange: (v: string, a: string) => void; 14 | randomiseData: () => void; 15 | refreshMap: () => void; 16 | uploadDataConfig: (e: any) => void; 17 | } 18 | 19 | const EditControls: React.FC = ({ 20 | map, 21 | handleAttrChange, 22 | randomiseData, 23 | refreshMap, 24 | uploadDataConfig 25 | }) => { 26 | const uniquePalette: string[] = getColorUsed(map.mapData); 27 | return ( 28 | <> 29 | 30 | handleAttrChange(e.target.value, 'mapStrokeWidth')} 34 | placeholder="Border Width" 35 | min={0} 36 | step={0.1} 37 | /> 38 | 39 | 46 | 47 | 54 | 55 | 62 | 63 | 64 | 65 | 66 | 69 | 70 | 71 | 74 | 75 | 76 |
77 | Click to Upload Config 78 | uploadDataConfig(e)} 80 | id="uploadBtn" 81 | type="file" 82 | className="upload" 83 | /> 84 |
85 | 102 | 103 | ); 104 | }; 105 | 106 | export default EditControls; 107 | -------------------------------------------------------------------------------- /components/Controls/ExportControls.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-explicit-any */ 2 | import version from '@/data/version'; 3 | import downloadConfig from '@/lib/downloadConfig'; 4 | import downloadMap from '@/lib/downloadMap'; 5 | import { LabelStoreType } from '@/typings/label.store'; 6 | import { MapStoreType } from '@/typings/map.store'; 7 | import { Button, Select, Spacer } from '@geist-ui/react'; 8 | import { Download, Save } from '@geist-ui/react-icons'; 9 | import React from 'react'; 10 | import InputLabel from '../InputLabel'; 11 | 12 | type ExportType = 'png' | 'svg' | 'pdf'; 13 | 14 | interface Props { 15 | map: MapStoreType; 16 | label: LabelStoreType; 17 | mapId: string; 18 | } 19 | const ExportControls: React.FC = ({ map, label, mapId }) => { 20 | const [downOp, setDownOp] = React.useState('png'); 21 | return ( 22 | <> 23 | 24 | 36 | 37 | 38 | 41 | 42 | 43 | 46 | 47 | 48 | 55 | 56 | ); 57 | }; 58 | 59 | export default ExportControls; 60 | -------------------------------------------------------------------------------- /components/Controls/LabelControls.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-explicit-any */ 2 | /* eslint-disable jsx-a11y/no-static-element-interactions */ 3 | /* eslint-disable jsx-a11y/click-events-have-key-events */ 4 | import { labelAtom } from '@/store/label.store'; 5 | import { LabelStoreType, LabelType } from '@/typings/label.store'; 6 | import { Input, Spacer } from '@geist-ui/react'; 7 | import { useAtom } from 'jotai'; 8 | import React from 'react'; 9 | import { PlusSquare } from '@geist-ui/react-icons'; 10 | 11 | import InputLabel from '../InputLabel'; 12 | import LabelContainer from '../Label/LabelContainer'; 13 | 14 | const LabelControls = () => { 15 | const [label, setLabel] = useAtom(labelAtom); 16 | const [text, setText] = React.useState(''); 17 | const addLabel = () => { 18 | if (text !== '') { 19 | const ctx = document.getElementById('labels-container'); 20 | if (ctx) { 21 | // const textElement = document.createElementNS('http://www.w3.org/2000/svg', 'text'); 22 | const count = ctx.childElementCount; 23 | ctx.innerHTML += ` 24 | ${text} 29 | `; 30 | const labObj: LabelType = { 31 | id: count + 1, 32 | fill: 'white', 33 | text, 34 | hide: false 35 | }; 36 | const newArr = label.data; 37 | newArr.push(labObj); 38 | 39 | setLabel((st: LabelStoreType) => ({ 40 | ...st, 41 | data: newArr 42 | })); 43 | setText(''); 44 | } 45 | } 46 | }; 47 | return ( 48 |
49 | 50 | 51 |
52 | setText(e.target.value)} 55 | placeholder="Enter Label" 56 | /> 57 |
58 | addLabel()} 63 | /> 64 |
65 |
66 | {label.data.length > 0 ? : ''} 67 | 76 |
77 | ); 78 | }; 79 | 80 | export default LabelControls; 81 | -------------------------------------------------------------------------------- /components/Controls/LegendAllControls.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-explicit-any */ 2 | import { MapStoreType } from '@/typings/map.store'; 3 | import { Input, Spacer, Toggle } from '@geist-ui/react'; 4 | import React from 'react'; 5 | import LegendControls from '@/components/Legend/LegendControls'; 6 | import ColorPickerInput from '../ColorPickerInput'; 7 | import InputLabel from '../InputLabel'; 8 | 9 | interface Props { 10 | map: MapStoreType; 11 | handleAttrChange: (v: string, a: string) => void; 12 | toggleHideLegend: (b: any) => void; 13 | smoothGradient: (b: any) => void; 14 | toggleSource: (b: any) => void; 15 | uniquePalette: string[]; 16 | } 17 | 18 | const LegendAllControls: React.FC = ({ 19 | map, 20 | handleAttrChange, 21 | toggleHideLegend, 22 | smoothGradient, 23 | toggleSource, 24 | uniquePalette 25 | }) => ( 26 |
27 | 34 | 35 | 36 | toggleHideLegend(e.target.checked)} size="large" /> 37 | 38 | 39 | smoothGradient(e.target.checked)} size="large" /> 40 | 41 | 42 | 43 | 44 | handleAttrChange(e.target.value, 'sourceText')} 47 | placeholder="Source Text" 48 | /> 49 | 50 | 51 | toggleSource(e.target.checked)} size="large" /> 52 |
53 | ); 54 | 55 | export default LegendAllControls; 56 | -------------------------------------------------------------------------------- /components/HideMapRegions.tsx: -------------------------------------------------------------------------------- 1 | import { Select, Spacer } from '@geist-ui/react'; 2 | import React from 'react'; 3 | import InputLabel from './InputLabel'; 4 | 5 | interface Props { 6 | stateCodes: { [key: string]: string }; 7 | val: string[]; 8 | handleHideStates: (s: string[]) => void; 9 | } 10 | 11 | const HideMapRegions: React.FC = ({ val, stateCodes, handleHideStates }) => ( 12 |
13 | 14 | 15 | 28 |
29 | ); 30 | 31 | export default HideMapRegions; 32 | -------------------------------------------------------------------------------- /components/InputLabel.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Spacer, Text } from '@geist-ui/react'; 3 | 4 | interface Props { 5 | text: string; 6 | beta?: boolean; 7 | } 8 | 9 | const InputLabel: React.FC = ({ text, beta = false }) => ( 10 |
11 | 12 | {text} {beta ? Beta : ''}{' '} 13 | 14 | 15 | 20 |
21 | ); 22 | 23 | export default InputLabel; 24 | -------------------------------------------------------------------------------- /components/Label/MiniLabelColorPicker.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable react/no-array-index-key */ 2 | /* eslint-disable jsx-a11y/no-static-element-interactions */ 3 | /* eslint-disable jsx-a11y/click-events-have-key-events */ 4 | /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */ 5 | import { colorPickerPalette } from '@/data/colors'; 6 | import { useTheme } from '@geist-ui/react'; 7 | import React from 'react'; 8 | 9 | interface Props { 10 | index: number; 11 | handleColor: (i: number, v: string) => void; 12 | } 13 | 14 | const MiniLabelColorPicker: React.FC = ({ index, handleColor }) => { 15 | const theme = useTheme(); 16 | const [open, setOpen] = React.useState(false); 17 | const bgColor = document.getElementById(`label-text-${index + 1}`)?.style.fill || 'white'; 18 | return ( 19 | <> 20 |
setOpen(!open)} 23 | className="box pointer"> 24 | {open && ( 25 |
26 |
27 | {colorPickerPalette.map((d, i) => ( 28 |
29 | {d.map((el) => ( 30 |
handleColor(index, el)} 32 | key={el} 33 | style={{ backgroundColor: el }} 34 | className="palette-box" 35 | /> 36 | ))} 37 |
38 | ))} 39 |
40 |
41 | )} 42 |
43 | 66 | 67 | ); 68 | }; 69 | 70 | export default MiniLabelColorPicker; 71 | -------------------------------------------------------------------------------- /components/Landing/FeatureCard.tsx: -------------------------------------------------------------------------------- 1 | import { useTheme } from '@geist-ui/react'; 2 | import React from 'react'; 3 | 4 | export interface FeatureType { 5 | heading: string; 6 | text: string; 7 | icon: JSX.Element; 8 | } 9 | 10 | interface Props { 11 | data: FeatureType; 12 | } 13 | 14 | const FeatureCard: React.FC = ({ data }) => { 15 | const { palette } = useTheme(); 16 | return ( 17 |
18 |
19 | {data.icon} 20 |

{data.heading}

21 |
22 | 23 |

{data.text}

24 | 51 |
52 | ); 53 | }; 54 | 55 | export default FeatureCard; 56 | -------------------------------------------------------------------------------- /components/Landing/FeatureContainer.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import LabelsIcon from '@/assets/icons/LabelsIcon'; 3 | import MapIcon from '@/assets/icons/MapIcon'; 4 | import ConfigIcon from '@/assets/icons/ConfigIcon'; 5 | import LegendIcon from '@/assets/icons/LegendIcon'; 6 | import FreeIcon from '@/assets/icons/FreeIcon'; 7 | import ImageIcon from '@/assets/icons/ImageIcon'; 8 | import FeatureCard, { FeatureType } from './FeatureCard'; 9 | 10 | const featList: FeatureType[] = [ 11 | { 12 | heading: '20+ Maps', 13 | text: 'Maps of Countries and Regions Around the World in different Projections', 14 | icon: 15 | }, 16 | { 17 | heading: 'Free', 18 | text: 'All Feature of Chloromaps would always be Free and Without Watermark.', 19 | icon: 20 | }, 21 | { 22 | heading: 'Export', 23 | text: 'Export Maps and Legends in .png .jpg .pdf in High Quality', 24 | icon: 25 | }, 26 | { 27 | heading: 'Labels', 28 | text: 'Add and Control Labels on your Maps with Ease', 29 | icon: 30 | }, 31 | { 32 | heading: 'Config', 33 | text: 'Save your Map Config and Edit and Reuse it anytime', 34 | icon: 35 | }, 36 | { 37 | heading: 'Legends', 38 | text: 'Develop Maps and Convert into Beautiful Legend Gradient', 39 | icon: 40 | } 41 | ]; 42 | 43 | const FeatureContainer = () => ( 44 | <> 45 |
46 | {featList.map((d) => ( 47 | 48 | ))} 49 |
50 | 66 | 67 | ); 68 | 69 | export default FeatureContainer; 70 | -------------------------------------------------------------------------------- /components/Landing/MapShowCard.tsx: -------------------------------------------------------------------------------- 1 | import { Link, useTheme } from '@geist-ui/react'; 2 | import React from 'react'; 3 | import { ExternalLink } from '@geist-ui/react-icons'; 4 | 5 | interface MapShowCardType { 6 | name: string; 7 | text: string; 8 | link: string; 9 | } 10 | 11 | interface Props { 12 | data: MapShowCardType; 13 | } 14 | 15 | const MapShowCard: React.FC = ({ data }) => { 16 | const { palette } = useTheme(); 17 | return ( 18 |
19 |
20 |

{data.name.toUpperCase()}

21 |
22 | 23 |

{data.text}

24 | 25 |

26 | Create 27 |

28 | 29 | 30 | 64 |
65 | ); 66 | }; 67 | 68 | export default MapShowCard; 69 | -------------------------------------------------------------------------------- /components/Legend/LegendContainer.tsx: -------------------------------------------------------------------------------- 1 | import { LegendData } from '@/typings/map.store'; 2 | import React from 'react'; 3 | import LegendGradient from './LegendGradient'; 4 | 5 | interface Props { 6 | data: LegendData[]; 7 | legendSmoothGradient: boolean; 8 | legendTextColor: string; 9 | sourceText: string; 10 | hideSource: boolean; 11 | } 12 | 13 | /* 14 | 15 | Notes: 16 | 17 | Initiality keep height and viewbox as 0 18 | and increase/decrease as element are added/removed 19 | 20 | if height = 30 then viewBox="0 0 364 30" 21 | 22 | */ 23 | 24 | const LegendContainer = ({ 25 | data, 26 | legendSmoothGradient, 27 | legendTextColor, 28 | hideSource, 29 | sourceText 30 | }: Props) => { 31 | const calcH = data.length * 40; 32 | return ( 33 | <> 34 | {!hideSource ? ( 35 | 42 | 43 | 44 | {sourceText} 45 | 46 | 47 | 48 | ) : null} 49 | 50 | {legendSmoothGradient ? ( 51 | 52 | ) : ( 53 | 60 | 61 | {data.map((dt: LegendData, i: number) => ( 62 | 63 | 64 | 65 | {dt.text} 66 | 67 | 68 | ))} 69 | 70 | 71 | )} 72 | 73 | ); 74 | }; 75 | 76 | export default LegendContainer; 77 | -------------------------------------------------------------------------------- /components/Legend/LegendGradient.tsx: -------------------------------------------------------------------------------- 1 | import { LegendData } from '@/typings/map.store'; 2 | import React from 'react'; 3 | 4 | interface Props { 5 | gradArr: LegendData[]; 6 | svgW?: number; 7 | svgH?: number; 8 | gradW?: number; 9 | gradH?: number; 10 | legendTextColor: string; 11 | } 12 | 13 | const LegendGradient: React.FC = ({ 14 | gradArr, 15 | svgW = 660, 16 | svgH = 60, 17 | gradW = 600, 18 | gradH = 30, 19 | legendTextColor 20 | }) => { 21 | const len = gradArr.length; 22 | return ( 23 | 24 | 25 | 26 | {gradArr.map((g, i) => ( 27 | 28 | ))} 29 | 30 | 31 | 32 | {gradArr.map((g, i) => ( 33 | 39 | {g.text} 40 | 41 | ))} 42 | 43 | 44 | 45 | ); 46 | }; 47 | 48 | export default LegendGradient; 49 | -------------------------------------------------------------------------------- /components/LoadExample/LoadExample.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable global-require */ 2 | /* eslint-disable react-hooks/exhaustive-deps */ 3 | import React from 'react'; 4 | import { useRouter } from 'next/dist/client/router'; 5 | import { ExportConfigType } from '@/typings/config'; 6 | import fillAllMap from '@/lib/fillAllMap'; 7 | import importLabelConfig from '@/lib/importLabelConfig'; 8 | import { labelAtom } from '@/store/label.store'; 9 | import { mapAtom } from '@/store/map.store'; 10 | import { useAtom } from 'jotai'; 11 | import { useToasts } from '@geist-ui/react'; 12 | 13 | interface ExampleMapType { 14 | [key: string]: ExportConfigType; 15 | } 16 | 17 | const exampleData: ExampleMapType = { 18 | india_population: require('@/configs/india.json'), 19 | usa_population: require('@/configs/usa.json'), 20 | sweden_population: require('@/configs/sweden.json'), 21 | press_freedom_index: require('@/configs/press_freedom_index.json'), 22 | apple_gdp_comp: require('@/configs/apple_gdp_comp.json'), 23 | europe_democraxy_index: require('@/configs/europe_democraxy_index.json'), 24 | lgbtq_marriage: require('@/configs/lgbtq_marriage.json'), 25 | most_searched_wonders: require('@/configs/most_searched_wonders.json') 26 | }; 27 | 28 | const LoadExample = () => { 29 | const router = useRouter(); 30 | const [, setMap] = useAtom(mapAtom); 31 | const [, setLabel] = useAtom(labelAtom); 32 | const [, setToast] = useToasts(); 33 | const successToast = () => 34 | setToast({ 35 | text: 'Succesfullly Loaded Map Configuration.', 36 | type: 'success', 37 | delay: 5000 38 | }); 39 | const errorToast = () => 40 | setToast({ 41 | text: 'No Data & Map Configuration Found.', 42 | type: 'error', 43 | delay: 5000 44 | }); 45 | React.useEffect(() => { 46 | if (router.query.data as string) { 47 | const slug = router.query.data as string; 48 | const data: ExportConfigType = exampleData[slug]; 49 | if (data) { 50 | setMap(data.mapData); 51 | fillAllMap(data.mapData.mapData, data.mapData.defaultFillColor); 52 | const labData = importLabelConfig(data.labelData); 53 | setLabel(labData); 54 | successToast(); 55 | } else { 56 | errorToast(); 57 | } 58 | } 59 | }, [router.query]); 60 | return <>; 61 | }; 62 | 63 | export default LoadExample; 64 | -------------------------------------------------------------------------------- /components/MapAddons/HideWaterBodies.tsx: -------------------------------------------------------------------------------- 1 | import { Toggle } from '@geist-ui/react'; 2 | import React from 'react'; 3 | import InputLabel from '../InputLabel'; 4 | 5 | interface Props { 6 | id: string; 7 | } 8 | 9 | const HideWaterBodies: React.FC = ({ id }) => { 10 | const hideElement = (bool: boolean) => { 11 | const el = document.getElementById(id); 12 | if (el) { 13 | const val = bool ? 'none' : 'block'; 14 | el.style.display = val; 15 | } 16 | }; 17 | return ( 18 |
19 | 20 | hideElement(e.target.checked)} size="large" /> 21 |
22 | ); 23 | }; 24 | 25 | export default HideWaterBodies; 26 | -------------------------------------------------------------------------------- /components/MapToolBox.tsx: -------------------------------------------------------------------------------- 1 | import { Button, ButtonGroup } from '@geist-ui/react'; 2 | import React from 'react'; 3 | import { Move, ZoomIn, ZoomOut, Repeat } from '@geist-ui/react-icons'; 4 | 5 | interface Props { 6 | isDrag: boolean; 7 | setIsDrag: React.Dispatch>; 8 | reset: () => void; 9 | onZoomIn: () => void; 10 | onZoomOut: () => void; 11 | } 12 | 13 | const MapToolBox: React.FC = ({ onZoomIn, onZoomOut, reset, isDrag, setIsDrag }) => ( 14 |
15 | 16 |
32 | ); 33 | 34 | export default MapToolBox; 35 | -------------------------------------------------------------------------------- /components/MiniColorPicker.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable react/no-array-index-key */ 2 | /* eslint-disable jsx-a11y/no-static-element-interactions */ 3 | /* eslint-disable jsx-a11y/click-events-have-key-events */ 4 | /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */ 5 | import { colorPickerPalette } from '@/data/colors'; 6 | import getColorUsed from '@/lib/getColorUsed'; 7 | import { MapStoreType } from '@/typings/map.store'; 8 | import { useTheme } from '@geist-ui/react'; 9 | import React from 'react'; 10 | 11 | interface Props { 12 | bgColor: string; 13 | map: MapStoreType; 14 | setMap: React.Dispatch>; 15 | index: number; 16 | } 17 | 18 | const MiniColorPicker: React.FC = ({ index, bgColor, map, setMap }) => { 19 | const theme = useTheme(); 20 | const uniquePalette: string[] = getColorUsed(map.mapData); 21 | const [open, setOpen] = React.useState(false); 22 | const handleColor = (v: string) => { 23 | const copy = map.mapData; 24 | copy.forEach((el) => { 25 | if (el.fill === bgColor) { 26 | el.fill = v; 27 | } 28 | }); 29 | const legendDataCopy = map.legendData; 30 | legendDataCopy[index].fill = v; 31 | setMap((prev: MapStoreType) => ({ 32 | ...prev, 33 | legendData: legendDataCopy, 34 | mapData: copy 35 | })); 36 | }; 37 | return ( 38 | <> 39 |
setOpen(!open)} 42 | className="box pointer"> 43 | {open && ( 44 |
45 |
46 | {colorPickerPalette.map((d, i) => ( 47 |
48 | {d.map((el) => ( 49 |
handleColor(el)} 51 | key={el} 52 | style={{ backgroundColor: el }} 53 | className={`palette-box ${ 54 | uniquePalette.includes(el) ? 'border' : '' 55 | }`} 56 | /> 57 | ))} 58 |
59 | ))} 60 |
61 |
62 | )} 63 |
64 | 93 | 94 | ); 95 | }; 96 | 97 | export default MiniColorPicker; 98 | -------------------------------------------------------------------------------- /components/PaletteBox.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable jsx-a11y/no-static-element-interactions */ 2 | /* eslint-disable jsx-a11y/click-events-have-key-events */ 3 | 4 | import getColorUsed from '@/lib/getColorUsed'; 5 | import { MapData } from '@/typings/map.store'; 6 | import React from 'react'; 7 | import InputLabel from './InputLabel'; 8 | 9 | interface Props { 10 | data: MapData[]; 11 | setColor: (v: string, a: string) => void; 12 | } 13 | 14 | const PaletteBox: React.FC = ({ data, setColor }) => { 15 | const handleColor = (v: string) => { 16 | setColor(v, 'mapFillColor'); 17 | }; 18 | const dt = getColorUsed(data); 19 | return ( 20 |
21 | {dt.length > 0 && ( 22 | <> 23 | 24 |
25 | {dt.map((d) => ( 26 |
handleColor(d)} 29 | className="box pointer" 30 | style={{ backgroundColor: d }} 31 | /> 32 | ))} 33 |
34 | 35 | )} 36 | 47 |
48 | ); 49 | }; 50 | 51 | export default PaletteBox; 52 | -------------------------------------------------------------------------------- /components/Seo/MainSEO.tsx: -------------------------------------------------------------------------------- 1 | import { NextSeo } from 'next-seo'; 2 | import React from 'react'; 3 | 4 | interface Props { 5 | title: string; 6 | description?: string; 7 | } 8 | 9 | const MainSEO: React.FC = ({ title, description }) => { 10 | const seoData = { 11 | title: `${title} | Chloromaps - Develop and Ship Choropleth Maps Faster`, 12 | description: `${ 13 | description || 'A Rapid Map Development and Editor , Ship maps Faster and without Pain.' 14 | }`, 15 | openGraph: { 16 | title: `${title} | Chloromaps - Develop and Ship Choropleth Maps Faster`, 17 | description: `${ 18 | description || 19 | 'A Rapid Map Development and Editor , Ship maps Faster and without Pain.' 20 | }` 21 | } 22 | }; 23 | return ( 24 | <> 25 | 26 | 27 | ); 28 | }; 29 | 30 | export default MainSEO; 31 | -------------------------------------------------------------------------------- /components/Seo/MapSEO.tsx: -------------------------------------------------------------------------------- 1 | import { NextSeo } from 'next-seo'; 2 | import React from 'react'; 3 | 4 | interface Props { 5 | name: string; 6 | type: 7 | | 'States' 8 | | 'Provinces' 9 | | 'Administrative Regions' 10 | | 'Countries' 11 | | 'States and territories' 12 | | 'Federative Units (States)' 13 | | 'Provinces and territories' 14 | | 'Administrative divisions' 15 | | 'Republics' 16 | | 'Prefectures' 17 | | 'Governorates' 18 | | 'Departments' 19 | | 'Regions' 20 | | 'Counties'; 21 | } 22 | 23 | const MapSEO: React.FC = ({ name, type = 'States' }) => { 24 | const seoData = { 25 | title: `${name} | Chloromaps - Develop and Ship Choropleth Maps Faster`, 26 | description: `Create your own Choropleth Visualisation of ${type} of ${name}, easily add Legends and Labels and export in a High Quality Image.`, 27 | openGraph: { 28 | title: `${name} | Chloromaps - Develop and Ship Choropleth Maps Faster`, 29 | description: `Create your own Choropleth Visualisation of ${type} of ${name}, easily add Legends and Labels and export in a High Quality Image.` 30 | } 31 | }; 32 | const tags: string[] = [`${name}`, `${name} Map`, `${name} Choropleth`]; 33 | return ( 34 | <> 35 | 44 | 45 | ); 46 | }; 47 | 48 | export default MapSEO; 49 | -------------------------------------------------------------------------------- /configs/apple_gdp_comp.json: -------------------------------------------------------------------------------- 1 | {"version":"v0.3.0-alpha","mapId":"world-map","mapData":{"defaultFillColor":"#444444","mapStrokeColor":"white","mapBackgroundColor":"black","mapStrokeWidth":"1","mapFillColor":"#FAFAFA","mapData":[{"code":"US","fill":"#FAFAFA","hide":false},{"code":"IN","fill":"#FAFAFA","hide":false},{"code":"CN","fill":"#FAFAFA","hide":false},{"code":"JP","fill":"#FAFAFA","hide":false},{"code":"DE","fill":"#FAFAFA","hide":false},{"code":"FR","fill":"#FAFAFA","hide":false},{"code":"GB","fill":"#FAFAFA","hide":false},{"code":"IT","fill":"#FAFAFA","hide":false}],"legendData":[{"fill":"#FAFAFA","text":"Countries with More GDP than Apple's Market Cap","hide":false}],"legendTextColor":"white","hideStates":[],"hideLegend":false,"legendSmoothGradient":false,"hideSource":false,"sourceText":""},"labelData":{"data":[],"scalingFactor":1.41}} -------------------------------------------------------------------------------- /configs/europe_democraxy_index.json: -------------------------------------------------------------------------------- 1 | {"version":"v0.3.0-alpha","mapId":"euro-map","mapData":{"defaultFillColor":"black","mapStrokeColor":"white","mapBackgroundColor":"black","mapStrokeWidth":"1","mapFillColor":"#880E4F","mapData":[{"code":"no","fill":"#1A237E","hide":false},{"code":"se","fill":"#1A237E","hide":false},{"code":"is","fill":"#1A237E","hide":false},{"code":"fi","fill":"#1A237E","hide":false},{"code":"dk","fill":"#1A237E","hide":false},{"code":"ie","fill":"#1A237E","hide":false},{"code":"nl","fill":"#1565C0","hide":false},{"code":"ch","fill":"#1565C0","hide":false},{"code":"lu","fill":"#1565C0","hide":false},{"code":"de","fill":"#1565C0","hide":false},{"code":"gb","fill":"#1565C0","hide":false},{"code":"at","fill":"#1565C0","hide":false},{"code":"es","fill":"#1565C0","hide":false},{"code":"fr","fill":"#2196F3","hide":false},{"code":"pt","fill":"#2196F3","hide":false},{"code":"ee","fill":"#2196F3","hide":false},{"code":"it","fill":"#2196F3","hide":false},{"code":"cz","fill":"#2196F3","hide":false},{"code":"be","fill":"#2196F3","hide":false},{"code":"cy","fill":"#2196F3","hide":false},{"code":"si","fill":"#2196F3","hide":false},{"code":"gr","fill":"#2196F3","hide":false},{"code":"lv","fill":"#2196F3","hide":false},{"code":"lt","fill":"#2196F3","hide":false},{"code":"sk","fill":"#90CAF9","hide":false},{"code":"pl","fill":"#90CAF9","hide":false},{"code":"bg","fill":"#90CAF9","hide":false},{"code":"hu","fill":"#90CAF9","hide":false},{"code":"rs","fill":"#90CAF9","hide":false},{"code":"hr","fill":"#90CAF9","hide":false},{"code":"ro","fill":"#90CAF9","hide":false},{"code":"al","fill":"#90CAF9","hide":false},{"code":"mk","fill":"#F48FB1","hide":false},{"code":"ua","fill":"#F48FB1","hide":false},{"code":"me","fill":"#F48FB1","hide":false},{"code":"md","fill":"#F48FB1","hide":false},{"code":"am","fill":"#F48FB1","hide":false},{"code":"ge","fill":"#F48FB1","hide":false},{"code":"ba","fill":"#EC407A","hide":false},{"code":"tr","fill":"#EC407A","hide":false},{"code":"ru","fill":"#C2185B","hide":false},{"code":"by","fill":"#880E4F","hide":false},{"code":"az","fill":"#880E4F","hide":false}],"legendData":[{"fill":"#1A237E","text":"9.0 - 10.0","hide":false},{"fill":"#1565C0","text":"8.0 - 8.9","hide":false},{"fill":"#2196F3","text":"7.0 - 7.9","hide":false},{"fill":"#90CAF9","text":"6.0 - 6.9","hide":false},{"fill":"#F48FB1","text":"5.0 - 5.9","hide":false},{"fill":"#EC407A","text":"4.0 - 4.9","hide":false},{"fill":"#C2185B","text":"3.0 - 3.9","hide":false},{"fill":"#880E4F","text":"2.0 - 2.9","hide":false}],"legendTextColor":"white","hideStates":[],"hideLegend":false,"legendSmoothGradient":false,"hideSource":false,"sourceText":""},"labelData":{"data":[],"scalingFactor":0.88}} -------------------------------------------------------------------------------- /configs/india.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "0.0.0-alpha", 3 | "mapId": "india-map", 4 | "mapData": { 5 | "defaultFillColor": "black", 6 | "mapStrokeColor": "white", 7 | "mapBackgroundColor": "black", 8 | "mapStrokeWidth": "1", 9 | "mapFillColor": "#00897b", 10 | "legendTextColor": "white", 11 | "legendSmoothGradient": false, 12 | "mapData": [ 13 | { "code": "33", "fill": "#b71c1c", "hide": false }, 14 | { "code": "21", "fill": "#d32f2f", "hide": false }, 15 | { "code": "5", "fill": "#d32f2f", "hide": false }, 16 | { "code": "35", "fill": "#ef5350", "hide": false }, 17 | { "code": "20", "fill": "#ef5350", "hide": false }, 18 | { "code": "31", "fill": "#ef5350", "hide": false }, 19 | { "code": "29", "fill": "#e57373", "hide": false }, 20 | { "code": "17", "fill": "#e57373", "hide": false }, 21 | { "code": "12", "fill": "#e57373", "hide": false }, 22 | { "code": "2", "fill": "#f8bbd0", "hide": false }, 23 | { "code": "26", "fill": "#f8bbd0", "hide": false }, 24 | { "code": "37", "fill": "#f8bbd0", "hide": false }, 25 | { "code": "18", "fill": "#f8bbd0", "hide": false }, 26 | { "code": "4", "fill": "#f8bbd0", "hide": false }, 27 | { "code": "16", "fill": "#f8bbd0", "hide": false }, 28 | { "code": "7", "fill": "#f8bbd0", "hide": false }, 29 | { "code": "13", "fill": "#f8bbd0", "hide": false }, 30 | { "code": "28", "fill": "#f8bbd0", "hide": false }, 31 | { "code": "10", "fill": "#80cbc4", "hide": false }, 32 | { "code": "36", "fill": "#80cbc4", "hide": false }, 33 | { "code": "34", "fill": "#80cbc4", "hide": false }, 34 | { "code": "14", "fill": "#26a69a", "hide": false }, 35 | { "code": "32", "fill": "#00897b", "hide": false }, 36 | { "code": "23", "fill": "#00897b", "hide": false }, 37 | { "code": "22", "fill": "#00897b", "hide": false }, 38 | { "code": "11", "fill": "#00695c", "hide": false }, 39 | { "code": "3", "fill": "#00695c", "hide": false }, 40 | { "code": "30", "fill": "#00695c", "hide": false }, 41 | { "code": "25", "fill": "#00695c", "hide": false }, 42 | { "code": "38", "fill": "#004d40", "hide": false }, 43 | { "code": "1", "fill": "#004d40", "hide": false }, 44 | { "code": "24", "fill": "#00897b", "hide": false } 45 | ], 46 | "legendData": [ 47 | { "fill": "#b71c1c", "text": "150 million+", "hide": false }, 48 | { "fill": "#d32f2f", "text": "100-110 million", "hide": false }, 49 | { "fill": "#ef5350", "text": "70-99 million", "hide": false }, 50 | { "fill": "#e57373", "text": "50-69 million", "hide": false }, 51 | { "fill": "#f8bbd0", "text": "20-49 million", "hide": false }, 52 | { "fill": "#80cbc4", "text": "10-19 million", "hide": false }, 53 | { "fill": "#26a69a", "text": "5 million", "hide": false }, 54 | { "fill": "#00897b", "text": "2-3 million", "hide": false }, 55 | { "fill": "#00695c", "text": "0.5-2 million", "hide": false }, 56 | { "fill": "#004d40", "text": "Less than 0.5million", "hide": false } 57 | ] 58 | }, 59 | "labelData": { "data": [], "scalingFactor": 1.67 } 60 | } 61 | -------------------------------------------------------------------------------- /configs/lgbtq_marriage.json: -------------------------------------------------------------------------------- 1 | {"version":"v0.3.0-alpha","mapId":"world-map","mapData":{"defaultFillColor":"#BDBDBD","mapStrokeColor":"#000000","mapBackgroundColor":"black","mapStrokeWidth":"0","mapFillColor":"#ff677d","mapData":[{"code":"AR","fill":"#ff677d","hide":false},{"code":"AU","fill":"#ff677d","hide":false},{"code":"AT","fill":"#ff677d","hide":false},{"code":"BR","fill":"#ff677d","hide":false},{"code":"BE","fill":"#ff677d","hide":false},{"code":"CA","fill":"#ff677d","hide":false},{"code":"CO","fill":"#ff677d","hide":false},{"code":"CR","fill":"#ff677d","hide":false},{"code":"DK","fill":"#ff677d","hide":false},{"code":"EC","fill":"#ff677d","hide":false},{"code":"FI","fill":"#ff677d","hide":false},{"code":"FR","fill":"#ff677d","hide":false},{"code":"DE","fill":"#ff677d","hide":false},{"code":"IS","fill":"#ff677d","hide":false},{"code":"IE","fill":"#ff677d","hide":false},{"code":"MX","fill":"#ff677d","hide":false},{"code":"NL","fill":"#ff677d","hide":false},{"code":"NO","fill":"#ff677d","hide":false},{"code":"NZ","fill":"#ff677d","hide":false},{"code":"PT","fill":"#ff677d","hide":false},{"code":"ZA","fill":"#ff677d","hide":false},{"code":"ES","fill":"#ff677d","hide":false},{"code":"SE","fill":"#ff677d","hide":false},{"code":"GB","fill":"#ff677d","hide":false},{"code":"TW","fill":"#ff677d","hide":false},{"code":"US","fill":"#ff677d","hide":false},{"code":"UY","fill":"#ff677d","hide":false}],"legendData":[{"fill":"#ff677d","text":"Countries where GAY Marriage is Legal","hide":false}],"legendTextColor":"white","hideStates":[],"hideLegend":false,"legendSmoothGradient":false,"hideSource":false,"sourceText":"https://en.wikipedia.org/wiki/Same-sex_marriage"},"labelData":{"data":[],"scalingFactor":1.41}} -------------------------------------------------------------------------------- /configs/sweden.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "0.0.0-alpha", 3 | "mapId": "sweden-map", 4 | "mapData": { 5 | "defaultFillColor": "black", 6 | "mapStrokeColor": "white", 7 | "mapBackgroundColor": "black", 8 | "mapStrokeWidth": "1", 9 | "legendTextColor": "white", 10 | "legendSmoothGradient": false, 11 | "mapFillColor": "#E91E63", 12 | "mapData": [ 13 | { "code": "SWE194", "fill": "#880E4F", "hide": false }, 14 | { "code": "SWE3429", "fill": "#C2185B", "hide": false }, 15 | { "code": "SWE3428", "fill": "#C2185B", "hide": false }, 16 | { "code": "SWE185", "fill": "#EC407A", "hide": false }, 17 | { "code": "SWE181", "fill": "#EC407A", "hide": false }, 18 | { "code": "SWE178", "fill": "#EC407A", "hide": false }, 19 | { "code": "SWE192", "fill": "#EC407A", "hide": false }, 20 | { "code": "SWE188", "fill": "#EC407A", "hide": false }, 21 | { "code": "SWE191", "fill": "#EC407A", "hide": false }, 22 | { "code": "SWE180", "fill": "#EC407A", "hide": false }, 23 | { "code": "SWE190", "fill": "#EC407A", "hide": false }, 24 | { "code": "SWE182", "fill": "#EC407A", "hide": false }, 25 | { "code": "SWE189", "fill": "#F48FB1", "hide": false }, 26 | { "code": "SWE262", "fill": "#F48FB1", "hide": false }, 27 | { "code": "SWE193", "fill": "#FCE4EC", "hide": false }, 28 | { "code": "SWE186", "fill": "#EC407A", "hide": false }, 29 | { "code": "SWE184", "fill": "#E91E63", "hide": false }, 30 | { "code": "SWE195", "fill": "#E91E63", "hide": false }, 31 | { "code": "SWE179", "fill": "#E91E63", "hide": false }, 32 | { "code": "SWE187", "fill": "#E91E63", "hide": false }, 33 | { "code": "SWE183", "fill": "#E91E63", "hide": false } 34 | ], 35 | "legendData": [ 36 | { "fill": "#880E4F", "text": "2million +", "hide": false }, 37 | { "fill": "#C2185B", "text": "1-2million", "hide": false }, 38 | { "fill": "#E91E63", "text": "300-500k", "hide": false }, 39 | { "fill": "#EC407A", "text": "200-300k", "hide": false }, 40 | { "fill": "#F48FB1", "text": "100-200k", "hide": false }, 41 | { "fill": "#FCE4EC", "text": "< 100k", "hide": false } 42 | ] 43 | }, 44 | "labelData": { "data": [], "scalingFactor": 1.67 } 45 | } 46 | -------------------------------------------------------------------------------- /configs/usa.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "0.0.0-alpha", 3 | "mapId": "usa-map", 4 | "mapData": { 5 | "defaultFillColor": "black", 6 | "mapStrokeColor": "white", 7 | "mapBackgroundColor": "black", 8 | "mapStrokeWidth": "1", 9 | "legendTextColor": "white", 10 | "legendSmoothGradient": false, 11 | "mapFillColor": "#C0CA33", 12 | "mapData": [ 13 | { "fill": "#FFF3E0", "code": "PW", "hide": false }, 14 | { "fill": "#FFF3E0", "code": "MP", "hide": false }, 15 | { "fill": "#FFF3E0", "code": "AS", "hide": false }, 16 | { "fill": "#FFF3E0", "code": "MH", "hide": false }, 17 | { "fill": "#FFF3E0", "code": "VI", "hide": false }, 18 | { "fill": "#FFF3E0", "code": "FM", "hide": false }, 19 | { "fill": "#FFF3E0", "code": "GU", "hide": false }, 20 | { "fill": "#FFF3E0", "code": "WY", "hide": false }, 21 | { "fill": "#FFF3E0", "code": "VT", "hide": false }, 22 | { "fill": "#FFF3E0", "code": "DC", "hide": false }, 23 | { "fill": "#FFF3E0", "code": "AK", "hide": false }, 24 | { "fill": "#FFF3E0", "code": "ND", "hide": false }, 25 | { "fill": "#FFF3E0", "code": "SD", "hide": false }, 26 | { "fill": "#FFF3E0", "code": "DE", "hide": false }, 27 | { "fill": "#FFF3E0", "code": "RI", "hide": false }, 28 | { "fill": "#FFF3E0", "code": "MT", "hide": false }, 29 | 30 | { "fill": "#FFE0B2", "code": "ME", "hide": false }, 31 | { "fill": "#FFE0B2", "code": "NH", "hide": false }, 32 | { "fill": "#FFE0B2", "code": "HI", "hide": false }, 33 | { "fill": "#FFE0B2", "code": "ID", "hide": false }, 34 | { "fill": "#FFE0B2", "code": "WV", "hide": false }, 35 | { "fill": "#FFE0B2", "code": "NE", "hide": false }, 36 | { "fill": "#FFE0B2", "code": "NM", "hide": false }, 37 | 38 | { "fill": "#FFCC80", "code": "KS", "hide": false }, 39 | { "fill": "#FFCC80", "code": "MS", "hide": false }, 40 | { "fill": "#FFCC80", "code": "AR", "hide": false }, 41 | { "fill": "#FFCC80", "code": "NV", "hide": false }, 42 | { "fill": "#FFCC80", "code": "IA", "hide": false }, 43 | { "fill": "#FFCC80", "code": "PR", "hide": false }, 44 | { "fill": "#FFCC80", "code": "UT", "hide": false }, 45 | { "fill": "#FFCC80", "code": "CT", "hide": false }, 46 | { "fill": "#FFCC80", "code": "OK", "hide": false }, 47 | { "fill": "#FFCC80", "code": "OR", "hide": false }, 48 | { "fill": "#FFCC80", "code": "KY", "hide": false }, 49 | { "fill": "#FFCC80", "code": "LA", "hide": false }, 50 | { "fill": "#FFCC80", "code": "AL", "hide": false }, 51 | 52 | { "fill": "#FFB74D", "code": "SC", "hide": false }, 53 | { "fill": "#FFB74D", "code": "MN", "hide": false }, 54 | { "fill": "#FFB74D", "code": "CO", "hide": false }, 55 | { "fill": "#FFB74D", "code": "WI", "hide": false }, 56 | { "fill": "#FFB74D", "code": "MD", "hide": false }, 57 | 58 | { "fill": "#FFA726", "code": "MO", "hide": false }, 59 | { "fill": "#FFA726", "code": "IN", "hide": false }, 60 | { "fill": "#FFA726", "code": "TN", "hide": false }, 61 | { "fill": "#FFA726", "code": "MA", "hide": false }, 62 | 63 | { "fill": "#FF9800", "code": "AZ", "hide": false }, 64 | { "fill": "#FF9800", "code": "WA", "hide": false }, 65 | 66 | { "fill": "#FB8C00", "code": "VA", "hide": false }, 67 | { "fill": "#FB8C00", "code": "NJ", "hide": false }, 68 | { "fill": "#FB8C00", "code": "MI", "hide": false }, 69 | 70 | { "fill": "#F57C00", "code": "NC", "hide": false }, 71 | { "fill": "#F57C00", "code": "GA", "hide": false }, 72 | { "fill": "#F57C00", "code": "OH", "hide": false }, 73 | { "fill": "#F57C00", "code": "IL", "hide": false }, 74 | { "fill": "#F57C00", "code": "PA", "hide": false }, 75 | 76 | { "fill": "#EF6C00", "code": "NY", "hide": false }, 77 | { "fill": "#EF6C00", "code": "FL", "hide": false }, 78 | 79 | { "fill": "#EF6C00", "code": "CA", "hide": false }, 80 | { "fill": "#EF6C00", "code": "TX", "hide": false } 81 | ], 82 | "legendData": [ 83 | { "fill": "#FFF3E0", "text": "<1mil", "hide": false }, 84 | { "fill": "#FFE0B2", "text": "1-2", "hide": false }, 85 | { "fill": "#FFCC80", "text": "2-5", "hide": false }, 86 | { "fill": "#FFB74D", "text": "5-6", "hide": false }, 87 | { "fill": "#FFA726", "text": "6-7", "hide": false }, 88 | { "fill": "#FF9800", "text": "7-8", "hide": false }, 89 | { "fill": "#FB8C00", "text": "8-10", "hide": false }, 90 | { "fill": "#F57C00", "text": "10-15", "hide": false }, 91 | { "fill": "#EF6C00", "text": "18-22", "hide": false }, 92 | { "fill": "#E65100", "text": "25+", "hide": false } 93 | ] 94 | }, 95 | "labelData": { "data": [], "scalingFactor": 1.67 } 96 | } 97 | -------------------------------------------------------------------------------- /data/Africa/AfricaStateCodes.ts: -------------------------------------------------------------------------------- 1 | export const AfricaStateCodes ={ 2 | "AO": "Angola", 3 | "BI": "Burundi", 4 | "BJ": "Benin", 5 | "BF": "Burkina Faso", 6 | "BW": "Botswana", 7 | "CF": "Central African Rep.", 8 | "CI": "Côte d'Ivoire", 9 | "CM": "Cameroon", 10 | "CD": "Dem. Rep. Congo", 11 | "CG": "Congo", 12 | "DJ": "Djibouti", 13 | "DZ": "Algeria", 14 | "EG": "Egypt", 15 | "ER": "Eritrea", 16 | "ET": "Ethiopia", 17 | "GA": "Gabon", 18 | "GH": "Ghana", 19 | "GN": "Guinea", 20 | "GM": "Gambia", 21 | "GW": "Guinea-Bissau", 22 | "GQ": "Eq. Guinea", 23 | "KE": "Kenya", 24 | "LR": "Liberia", 25 | "LY": "Libya", 26 | "LS": "Lesotho", 27 | "MA": "Morocco", 28 | "MG": "Madagascar", 29 | "ML": "Mali", 30 | "MZ": "Mozambique", 31 | "MR": "Mauritania", 32 | "MW": "Malawi", 33 | "NA": "Namibia", 34 | "NE": "Niger", 35 | "NG": "Nigeria", 36 | "RW": "Rwanda", 37 | "EH": "W. Sahara", 38 | "SD": "Sudan", 39 | "SS": "S. Sudan", 40 | "SN": "Senegal", 41 | "SL": "Sierra Leone", 42 | "SZ": "Swaziland", 43 | "TD": "Chad", 44 | "TG": "Togo", 45 | "TN": "Tunisia", 46 | "TZ": "Tanzania", 47 | "UG": "Uganda", 48 | "ZA": "South Africa", 49 | "ZM": "Zambia", 50 | "ZW": "Zimbabwe", 51 | "SO": "Somalia" 52 | } -------------------------------------------------------------------------------- /data/Argentina/ArgentinaStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const ArgentinaStateCodes ={ 2 | "ARG1271": "Santa Cruz", 3 | "ARG1272": "Tierra del Fuego", 4 | "ARG1273": "San Juan", 5 | "ARG1274": "Chubut", 6 | "ARG1275": "Mendoza", 7 | "ARG1276": "Neuquén", 8 | "ARG1295": "Buenos Aires", 9 | "ARG1296": "La Pampa", 10 | "ARG1297": "Río Negro", 11 | "ARG1298": "San Luis", 12 | "ARG1299": "Córdoba", 13 | "ARG1300": "Catamarca", 14 | "ARG1301": "Jujuy", 15 | "ARG1302": "La Rioja", 16 | "ARG1303": "Salta", 17 | "ARG1304": "Santiago del Estero", 18 | "ARG1305": "Tucumán", 19 | "ARG1306": "Chaco", 20 | "ARG1307": "Formosa", 21 | "ARG1308": "Corrientes", 22 | "ARG1309": "Entre Ríos", 23 | "ARG1310": "Santa Fe", 24 | "ARG1312": "Misiones", 25 | "ARG5493": "Ciudad de Buenos Aires" 26 | } -------------------------------------------------------------------------------- /data/Australia/AustraliaStateCodes.ts: -------------------------------------------------------------------------------- 1 | export const AustraliaStateCodes = { 2 | "AUS00": "Macquarie Island", 3 | "AUS1932": "Jervis Bay Territory", 4 | "AUS2650": "Northern Territory", 5 | "AUS2651": "Western Australia", 6 | "AUS2653": "Australian Capital Territory", 7 | "AUS2654": "New South Wales", 8 | "AUS2655": "South Australia", 9 | "AUS2656": "Victoria", 10 | "AUS2657": "Queensland", 11 | "AUS2659": "Norfolk Island", 12 | "AUS2660": "Tasmania" 13 | } -------------------------------------------------------------------------------- /data/Azerbaijan/AzerbaijanStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const AzerbaijanStateCodes ={ 2 | "AZE1676": "Ağstafa", 3 | "AZE1677": "Daşkəsən", 4 | "AZE1678": "Gədəbəy", 5 | "AZE1679": "Gəncə", 6 | "AZE1680": "Xanlar", 7 | "AZE1681": "Goranboy", 8 | "AZE1682": "Kəlbəcər", 9 | "AZE1683": "Mingəçevir", 10 | "AZE1684": "Qazax", 11 | "AZE1685": "Şəmkir", 12 | "AZE1686": "Samux", 13 | "AZE1687": "Tovuz", 14 | "AZE1688": "Yevlakh Rayon", 15 | "AZE1689": "Bakı", 16 | "AZE1690": "Abşeron", 17 | "AZE1691": "Ağdam", 18 | "AZE1692": "Ağdaş", 19 | "AZE1693": "Ağsu", 20 | "AZE1694": "Hajigabul", 21 | "AZE1695": "Astara", 22 | "AZE1696": "Bərdə", 23 | "AZE1697": "Beyləqan", 24 | "AZE1698": "Biləsuvar", 25 | "AZE1699": "Cəbrayıl", 26 | "AZE1700": "Cəlilabad", 27 | "AZE1701": "Dəvəçi", 28 | "AZE1702": "Füzuli", 29 | "AZE1703": "Göyçay", 30 | "AZE1704": "İmişli", 31 | "AZE1705": "İsmayıllı", 32 | "AZE1706": "Kürdəmir", 33 | "AZE1707": "Lankaran", 34 | "AZE1708": "Masallı", 35 | "AZE1709": "Lerik", 36 | "AZE1710": "Neftçala", 37 | "AZE1711": "Qobustan", 38 | "AZE1712": "Siyəzən", 39 | "AZE1713": "Saatlı", 40 | "AZE1714": "Sabirabad", 41 | "AZE1715": "Salyan", 42 | "AZE1716": "Şamaxı", 43 | "AZE1717": "Sumqayıt", 44 | "AZE1718": "Ucar", 45 | "AZE1719": "Xizı", 46 | "AZE1720": "Yardımlı", 47 | "AZE1721": "Zərdab", 48 | "AZE1722": "Ağcabədi", 49 | "AZE1723": "Balakən", 50 | "AZE1724": "Qəbələ", 51 | "AZE1725": "Oğuz", 52 | "AZE1726": "Qax", 53 | "AZE1727": "Şəki", 54 | "AZE1728": "Quba", 55 | "AZE1729": "Qusar", 56 | "AZE1730": "Xaçmaz", 57 | "AZE1731": "Zaqatala", 58 | "AZE1734": "Xocavənd", 59 | "AZE1735": "Lankaran", 60 | "AZE1736": "Qubadli", 61 | "AZE1737": "Şuşa", 62 | "AZE1738": "Tərtər", 63 | "AZE1739": "Xocalı", 64 | "AZE1740": "Zəngilan", 65 | "AZE2415": "Sədərək", 66 | "AZE2418": "Ordubad", 67 | "AZE2419": "Şərur", 68 | "AZE2420": "Babək", 69 | "AZE2421": "Culfa", 70 | "AZE2422": "Naxçıvan", 71 | "AZE2423": "Şahbuz", 72 | "AZE4838": "Stepanakert", 73 | "AZE5561": "Naftalan", 74 | "AZE5562": "Lankaran", 75 | "AZE5563": "Shirvan", 76 | "AZE5564": "Şəki", 77 | "AZE5565": "Şuşa", 78 | "AZE5566": "Yevlakh", 79 | "AZE5567": "Kangarli" 80 | } -------------------------------------------------------------------------------- /data/Brazil/BrazilStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const BrazilStateCodes ={ 2 | "BRA1294": "Goiás", 3 | "BRA1311": "São Paulo", 4 | "BRA1313": "Pernambuco", 5 | "BRA576": "Acre", 6 | "BRA592": "Amazonas", 7 | "BRA593": "Maranhão", 8 | "BRA594": "Pará", 9 | "BRA595": "Rondônia", 10 | "BRA596": "Tocantins", 11 | "BRA599": "Distrito Federal", 12 | "BRA600": "Mato Grosso do Sul", 13 | "BRA601": "Minas Gerais", 14 | "BRA602": "Mato Grosso", 15 | "BRA612": "Rio Grande do Sul", 16 | "BRA613": "Paraná", 17 | "BRA614": "Santa Catarina", 18 | "BRA621": "Ceará", 19 | "BRA622": "Piauí", 20 | "BRA623": "Alagoas", 21 | "BRA624": "Bahia", 22 | "BRA625": "Espírito Santo", 23 | "BRA626": "Paraíba", 24 | "BRA627": "Rio de Janeiro", 25 | "BRA628": "Rio Grande do Norte", 26 | "BRA629": "Sergipe", 27 | "BRA670": "Roraima", 28 | "BRA681": "Amapá" 29 | } -------------------------------------------------------------------------------- /data/Canada/CanadaStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const CanadaStateCodes = { 2 | CAN630: 'Manitoba', 3 | CAN631: 'Saskatchewan', 4 | CAN632: 'Alberta', 5 | CAN633: 'British Columbia', 6 | CAN634: 'Nunavut', 7 | CAN635: 'Northwest Territories', 8 | CAN636: 'Yukon', 9 | CAN682: 'Ontario', 10 | CAN683: 'Québec', 11 | CAN684: 'New Brunswick', 12 | CAN685: 'Nova Scotia', 13 | CAN686: 'Newfoundland and Labrador', 14 | CAN687: 'Prince Edward Island' 15 | }; 16 | -------------------------------------------------------------------------------- /data/China/ChinaStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const ChinaStateCodes = { 2 | CHN1150: 'Gansu', 3 | CHN1151: 'Qinghai', 4 | CHN1152: 'Guangxi', 5 | CHN1153: 'Guizhou', 6 | CHN1154: 'Chongqing', 7 | CHN1155: 'Beijing', 8 | CHN1178: 'Fujian', 9 | CHN1179: 'Anhui', 10 | CHN1180: 'Guangdong', 11 | CHN1662: 'Xizang', 12 | CHN1756: 'Xinjiang', 13 | CHN1775: 'Hainan', 14 | CHN1803: 'Ningxia', 15 | CHN1804: 'Shaanxi', 16 | CHN1805: 'Shanxi', 17 | CHN1807: 'Hubei', 18 | CHN1808: 'Hunan', 19 | CHN1809: 'Sichuan', 20 | CHN1810: 'Yunnan', 21 | CHN1811: 'Hebei', 22 | CHN1812: 'Henan', 23 | CHN1813: 'Liaoning', 24 | CHN1814: 'Shandong', 25 | CHN1816: 'Tianjin', 26 | CHN1817: 'Jiangxi', 27 | CHN1818: 'Jiangsu', 28 | CHN1819: 'Shanghai', 29 | CHN1820: 'Zhejiang', 30 | CHN1828: 'Jilin', 31 | CHN1838: 'Inner Mongol', 32 | CHN1839: 'Heilongjiang', 33 | PFA00: 'Paracel Islands' 34 | }; 35 | -------------------------------------------------------------------------------- /data/Egypt/EgyptStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const EgyptStateCodes = { 2 | EGY1530: 'Al Gharbiyah', 3 | EGY1531: 'Al Isma`iliyah', 4 | EGY1532: 'Al Minufiyah', 5 | EGY1533: 'Al Qahirah', 6 | EGY1534: 'Al Qalyubiyah', 7 | EGY1535: 'Ash Sharqiyah', 8 | EGY1536: 'As Suways', 9 | EGY1537: 'Ad Daqahliyah', 10 | EGY1538: 'Bur Sa`id', 11 | EGY1539: 'Dumyat', 12 | EGY1540: 'Matruh', 13 | EGY1541: 'Al Buhayrah', 14 | EGY1542: 'Al Fayyum', 15 | EGY1543: 'Al Iskandariyah', 16 | EGY1544: 'Al Jizah', 17 | EGY1545: 'Al Minya', 18 | EGY1546: 'Bani Suwayf', 19 | EGY1547: 'Kafr ash Shaykh', 20 | EGY1548: 'Aswan', 21 | EGY1549: 'Asyut', 22 | EGY1550: 'Al Wadi at Jadid', 23 | EGY1551: 'Qina', 24 | EGY1552: 'Suhaj', 25 | EGY1556: 'Al Bahr al Ahmar', 26 | EGY1557: "Janub Sina'", 27 | EGY1558: "Shamal Sina'", 28 | EGY5494: 'Luxor' 29 | }; 30 | -------------------------------------------------------------------------------- /data/Euro/EuroStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const EuroStateCodes = { 2 | al: 'Albania', 3 | am: 'Armenia', 4 | at: 'Austria', 5 | be: 'Belgium', 6 | bg: 'Bulgaria', 7 | ba: 'Bosnia and Herz.', 8 | by: 'Belarus', 9 | ch: 'Switzerland', 10 | cz: 'Czech Rep.', 11 | de: 'Germany', 12 | dk: 'Denmark', 13 | ee: 'Estonia', 14 | fi: 'Finland', 15 | gb: 'United Kingdom', 16 | ge: 'Georgia', 17 | gr: 'Greece', 18 | hr: 'Croatia', 19 | hu: 'Hungary', 20 | ie: 'Ireland', 21 | is: 'Iceland', 22 | it: 'Italy', 23 | li: 'Leichtenstein', 24 | lt: 'Lithuania', 25 | lu: 'Luxembourg', 26 | lv: 'Latvia', 27 | mc: 'Monaco', 28 | md: 'Moldova', 29 | mk: 'Macedonia', 30 | me: 'Montenegro', 31 | nl: 'Netherlands', 32 | no: 'Norway', 33 | pl: 'Poland', 34 | pt: 'Portugal', 35 | ro: 'Romania', 36 | rs: 'Serbia', 37 | sk: 'Slovakia', 38 | si: 'Slovenia', 39 | se: 'Sweden', 40 | ua: 'Ukraine', 41 | fr: 'France', 42 | es: 'Spain', 43 | tr: 'Turkey', 44 | xk: 'Kosovo', 45 | cy: 'Cyprus', 46 | ru: 'Russia', 47 | az: 'Azerbaijan', 48 | va: 'Vatican City', 49 | water_bodies: 'Water Bodies' 50 | }; 51 | -------------------------------------------------------------------------------- /data/France-Departments/FranceStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const FranceStateCodes = { 2 | FRA5262: 'Ain', 3 | FRA5263: 'Aisne', 4 | FRA5264: 'Allier', 5 | FRA5265: 'Alpes-de-Haute-Provence', 6 | FRA5266: 'Alpes-Maritimes', 7 | FRA5267: 'Ardèche', 8 | FRA5268: 'Ardennes', 9 | FRA5269: 'Ariège', 10 | FRA5270: 'Aube', 11 | FRA5271: 'Aude', 12 | FRA5272: 'Aveyron', 13 | FRA5273: 'Bas-Rhin', 14 | FRA5274: 'Bouches-du-Rhône', 15 | FRA5275: 'Calvados', 16 | FRA5276: 'Cantal', 17 | FRA5277: 'Charente', 18 | FRA5278: 'Charente-Maritime', 19 | FRA5279: 'Cher', 20 | FRA5280: 'Corrèze', 21 | FRA5281: 'Corse-du-Sud', 22 | FRA5282: "Côte-d'Or", 23 | FRA5283: "Côtes-d'Armor", 24 | FRA5284: 'Creuse', 25 | FRA5285: 'Deux-Sèvres', 26 | FRA5286: 'Dordogne', 27 | FRA5287: 'Doubs', 28 | FRA5288: 'Drôme', 29 | FRA5289: 'Essonne', 30 | FRA5290: 'Eure', 31 | FRA5291: 'Eure-et-Loir', 32 | FRA5292: 'Finistère', 33 | FRA5293: 'Gard', 34 | FRA5294: 'Gers', 35 | FRA5295: 'Gironde', 36 | FRA5296: 'Haute-Rhin', 37 | FRA5297: 'Haute-Corse', 38 | FRA5298: 'Haute-Garonne', 39 | FRA5299: 'Haute-Loire', 40 | FRA5300: 'Haute-Marne', 41 | FRA5301: 'Haute-Saône', 42 | FRA5302: 'Haute-Savoie', 43 | FRA5303: 'Haute-Vienne', 44 | FRA5304: 'Hautes-Alpes', 45 | FRA5305: 'Hautes-Pyrénées', 46 | FRA5306: 'Hauts-de-Seine', 47 | FRA5307: 'Hérault', 48 | FRA5308: 'Ille-et-Vilaine', 49 | FRA5309: 'Indre', 50 | FRA5310: 'Indre-et-Loire', 51 | FRA5311: 'Isère', 52 | FRA5312: 'Jura', 53 | FRA5313: 'Landes', 54 | FRA5314: 'Loir-et-Cher', 55 | FRA5315: 'Loire', 56 | FRA5316: 'Loire-Atlantique', 57 | FRA5317: 'Loiret', 58 | FRA5318: 'Lot', 59 | FRA5319: 'Lot-et-Garonne', 60 | FRA5320: 'Lozère', 61 | FRA5321: 'Maine-et-Loire', 62 | FRA5322: 'Manche', 63 | FRA5323: 'Marne', 64 | FRA5324: 'Mayenne', 65 | FRA5325: 'Meurhe-et-Moselle', 66 | FRA5326: 'Meuse', 67 | FRA5327: 'Morbihan', 68 | FRA5328: 'Moselle', 69 | FRA5329: 'Nièvre', 70 | FRA5330: 'Nord', 71 | FRA5331: 'Oise', 72 | FRA5332: 'Orne', 73 | FRA5333: 'Paris', 74 | FRA5334: 'Pas-de-Calais', 75 | FRA5335: 'Puy-de-Dôme', 76 | FRA5336: 'Pyrénées-Atlantiques', 77 | FRA5337: 'Pyrénées-Orientales', 78 | FRA5338: 'Rhône', 79 | FRA5339: 'Saône-et-Loire', 80 | FRA5340: 'Sarthe', 81 | FRA5341: 'Savoie', 82 | FRA5342: 'Seien-et-Marne', 83 | FRA5343: 'Seine-Maritime', 84 | FRA5344: 'Seine-Saint-Denis', 85 | FRA5345: 'Somme', 86 | FRA5346: 'Tarn', 87 | FRA5347: 'Tarn-et-Garonne', 88 | FRA5348: 'Territoire de Belfort', 89 | FRA5349: "Val-d'Oise", 90 | FRA5350: 'Val-de-Marne', 91 | FRA5351: 'Var', 92 | FRA5352: 'Vaucluse', 93 | FRA5353: 'Vendée', 94 | FRA5354: 'Vienne', 95 | FRA5355: 'Vosges', 96 | FRA5356: 'Yonne', 97 | FRA5357: 'Yvelines' 98 | }; 99 | -------------------------------------------------------------------------------- /data/France/FranceStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const FranceStateCodes = { 2 | ara: 'Auvergne-Rhône-Alpes', 3 | bfc: 'Bourgogne-Franche-Comté', 4 | bre: 'Bretagne', 5 | cor: 'Corse', 6 | cvl: 'Centre-Val de Loire', 7 | ges: 'Grand Est', 8 | hdf: 'Hauts-de-France', 9 | idf: 'Île-de-France', 10 | naq: 'Nouvelle-Aquitaine', 11 | nor: 'Normandie', 12 | occ: 'Occitanie', 13 | pac: "Provence-Alpes-Côte d'Azur", 14 | pdl: 'Pays de la Loire' 15 | }; 16 | -------------------------------------------------------------------------------- /data/India/IndiaStateCode.ts: -------------------------------------------------------------------------------- 1 | export const IndianStateCodes = { 2 | "1": "Andaman And Nicobar", 3 | "10": "Delhi", 4 | "11": "Goa", 5 | "12": "Gujarat", 6 | "13": "Haryana", 7 | "14": "Himachal Pradesh", 8 | "16": "Jharkhand", 9 | "17": "Karnataka", 10 | "18": "Kerala", 11 | "19": "Lakshadweep", 12 | "2": "Andhra Pradesh", 13 | "20": "Madhya Pradesh", 14 | "21": "Maharashtra", 15 | "22": "Manipur", 16 | "23": "Meghalaya", 17 | "24": "Mizoram", 18 | "25": "Nagaland", 19 | "26": "Orissa", 20 | "27": "Puducherry", 21 | "28": "Punjab", 22 | "29": "Rajasthan", 23 | "3": "Arunachal Pradesh", 24 | "30": "Sikkim", 25 | "31": "Tamil Nadu", 26 | "32": "Tripura", 27 | "33": "Uttar Pradesh", 28 | "34": "Uttaranchal", 29 | "35": "West Bengal", 30 | "36": "Jammu And Kashmir", 31 | "37": "Telangana", 32 | "38": "Ladakh", 33 | "4": "Assam", 34 | "5": "Bihar", 35 | "6": "Chandigarh", 36 | "7": "Chhattisgarh", 37 | "8": "Dadra And Nagar Haveli", 38 | "9": "Daman And Diu" 39 | } -------------------------------------------------------------------------------- /data/Italy/ItalyStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const ItalyStateCodes = { 2 | abruzzo: 'Abruzzo', 3 | 'aosta-valley': 'Aosta Valley', 4 | apulia: 'Apulia', 5 | basilicata: 'Basilicata', 6 | calabria: 'Calabria', 7 | campania: 'Campania', 8 | 'emilia-romagna': 'Emilia-Romagna', 9 | 'friuli-venezia-giulia': 'Friuli-Venezia Giulia', 10 | lazio: 'Lazio', 11 | liguria: 'Liguria', 12 | lombardy: 'Lombardy', 13 | marche: 'Marche', 14 | molise: 'Molise', 15 | piedmont: 'Piedmont', 16 | sardinia: 'Sardinia', 17 | sicily: 'Sicily', 18 | 'trentino-south-tyrol': 'Trentino-South Tyrol', 19 | tuscany: 'Tuscany', 20 | umbria: 'Umbria', 21 | veneto: 'Veneto' 22 | }; 23 | -------------------------------------------------------------------------------- /data/Japan/JapanStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const JapanStateCodes ={ 2 | "JPN1821": "Hiroshima", 3 | "JPN1822": "Okayama", 4 | "JPN1824": "Shimane", 5 | "JPN1825": "Tottori", 6 | "JPN1826": "Yamaguchi", 7 | "JPN1827": "Saga", 8 | "JPN1829": "Fukuoka", 9 | "JPN1830": "Kumamoto", 10 | "JPN1831": "Miyazaki", 11 | "JPN1832": "Ehime", 12 | "JPN1833": "Kagawa", 13 | "JPN1834": "Kochi", 14 | "JPN1835": "Oita", 15 | "JPN1836": "Tokushima", 16 | "JPN1840": "Aichi", 17 | "JPN1841": "Gifu", 18 | "JPN1842": "Ishikawa", 19 | "JPN1843": "Mie", 20 | "JPN1844": "Nagano", 21 | "JPN1845": "Shizuoka", 22 | "JPN1846": "Toyama", 23 | "JPN1847": "Hokkaido", 24 | "JPN1848": "Fukui", 25 | "JPN1849": "Hyōgo", 26 | "JPN1850": "Kyoto", 27 | "JPN1851": "Nara", 28 | "JPN1852": "Osaka", 29 | "JPN1853": "Shiga", 30 | "JPN1854": "Wakayama", 31 | "JPN1855": "Chiba", 32 | "JPN1856": "Ibaraki", 33 | "JPN1857": "Kanagawa", 34 | "JPN1858": "Saitama", 35 | "JPN1859": "Tochigi", 36 | "JPN1860": "Tokyo", 37 | "JPN1861": "Yamanashi", 38 | "JPN1862": "Akita", 39 | "JPN1863": "Aomori", 40 | "JPN1864": "Fukushima", 41 | "JPN1865": "Iwate", 42 | "JPN1866": "Miyagi", 43 | "JPN1867": "Niigata", 44 | "JPN1868": "Yamagata", 45 | "JPN3500": "Nagasaki", 46 | "JPN3501": "Kagoshima", 47 | "JPN3502": "Okinawa", 48 | "JPN3503": "Gunma" 49 | } -------------------------------------------------------------------------------- /data/Korea/KoreaStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const KoreaStateCodes = { 2 | KOR2494: 'North Chungcheong', 3 | KOR2495: 'Incheon', 4 | KOR2496: 'Gangwon', 5 | KOR2497: 'Seoul', 6 | KOR2498: 'Gyeonggi', 7 | KOR2499: 'North Jeolla', 8 | KOR2500: 'Gwangju', 9 | KOR2502: 'South Chungcheong', 10 | KOR2503: 'Daejeon', 11 | KOR2504: 'Daegu', 12 | KOR2505: 'South Gyeongsang', 13 | KOR2506: 'South Jeolla', 14 | KOR2507: 'Busan', 15 | KOR2508: 'Ulsan', 16 | KOR2509: 'North Gyeongsang', 17 | KOR2510: 'Jeju', 18 | KOR5129: 'Sejong' 19 | }; 20 | -------------------------------------------------------------------------------- /data/Mexico/MexicoStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const MexicoStateCodes ={ 2 | "MEX2706": "Baja California", 3 | "MEX2707": "Baja California Sur", 4 | "MEX2708": "Coahuila", 5 | "MEX2709": "Chihuahua", 6 | "MEX2710": "Durango", 7 | "MEX2711": "Sinaloa", 8 | "MEX2712": "Sonora", 9 | "MEX2713": "Zacatecas", 10 | "MEX2714": "Nuevo León", 11 | "MEX2715": "San Luis Potosí", 12 | "MEX2716": "Tamaulipas", 13 | "MEX2717": "Aguascalientes", 14 | "MEX2718": "Colima", 15 | "MEX2719": "Jalisco", 16 | "MEX2720": "Michoacán", 17 | "MEX2721": "Nayarit", 18 | "MEX2722": "Campeche", 19 | "MEX2723": "Oaxaca", 20 | "MEX2724": "Puebla", 21 | "MEX2725": "Tabasco", 22 | "MEX2726": "Tlaxcala", 23 | "MEX2727": "Distrito Federal", 24 | "MEX2728": "Guanajuato", 25 | "MEX2729": "Guerrero", 26 | "MEX2730": "Hidalgo", 27 | "MEX2731": "México", 28 | "MEX2732": "Morelos", 29 | "MEX2733": "Querétaro", 30 | "MEX2734": "Veracruz", 31 | "MEX2735": "Chiapas", 32 | "MEX2736": "Quintana Roo", 33 | "MEX2737": "Yucatán" 34 | } -------------------------------------------------------------------------------- /data/Nigeria/NigeriaStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const NigeriaStateCodes ={ 2 | "NGA2839": "Borno", 3 | "NGA2841": "Abia", 4 | "NGA2842": "Akwa Ibom", 5 | "NGA2843": "Imo", 6 | "NGA2844": "Rivers", 7 | "NGA2845": "Bayelsa", 8 | "NGA2846": "Benue", 9 | "NGA2847": "Cross River", 10 | "NGA2848": "Taraba", 11 | "NGA2849": "Kwara", 12 | "NGA2850": "Lagos", 13 | "NGA2851": "Niger", 14 | "NGA2852": "Ogun", 15 | "NGA2853": "Ondo", 16 | "NGA2854": "Ekiti", 17 | "NGA2855": "Osun", 18 | "NGA2856": "Oyo", 19 | "NGA2857": "Anambra", 20 | "NGA2858": "Bauchi", 21 | "NGA2859": "Gombe", 22 | "NGA2860": "Delta", 23 | "NGA2861": "Edo", 24 | "NGA2862": "Enugu", 25 | "NGA2863": "Ebonyi", 26 | "NGA2864": "Kaduna", 27 | "NGA2865": "Kogi", 28 | "NGA2866": "Plateau", 29 | "NGA2867": "Nassarawa", 30 | "NGA2868": "Jigawa", 31 | "NGA2869": "Kano", 32 | "NGA2870": "Katsina", 33 | "NGA2871": "Sokoto", 34 | "NGA2872": "Zamfara", 35 | "NGA2873": "Yobe", 36 | "NGA2879": "Kebbi", 37 | "NGA2881": "Adamawa", 38 | "NGA3470": "Federal Capital Territory" 39 | } -------------------------------------------------------------------------------- /data/Poland/PolandStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const PolandStateCodes = { 2 | POL3139: 'Warmian-Masurian', 3 | POL3140: 'Pomeranian', 4 | POL3141: 'Lower Silesian', 5 | POL3142: 'West Pomeranian', 6 | POL3143: 'Lubusz', 7 | POL3144: 'Greater Poland', 8 | POL3145: 'Kuyavian-Pomeranian', 9 | POL3146: 'Silesian', 10 | POL3147: 'Łódź', 11 | POL3148: 'Masovian', 12 | POL3149: 'Świętokrzyskie', 13 | POL3150: 'Podlachian', 14 | POL3151: 'Lublin', 15 | POL3152: 'Subcarpathian', 16 | POL3167: 'Opole', 17 | POL3170: 'Lesser Poland' 18 | }; 19 | -------------------------------------------------------------------------------- /data/Spain/SpainStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const SpainStateCodes = { 2 | ESP5801: 'Álava', 3 | ESP5802: 'Albacete', 4 | ESP5803: 'Alicante', 5 | ESP5804: 'Almería', 6 | ESP5805: 'Asturias', 7 | ESP5806: 'Ávila', 8 | ESP5807: 'Badajoz', 9 | ESP5808: 'Baleares', 10 | ESP5809: 'Barcelona', 11 | ESP5810: 'Burgos', 12 | ESP5811: 'Cáceres', 13 | ESP5812: 'Cádiz', 14 | ESP5813: 'Cantabria', 15 | ESP5814: 'Castellón', 16 | ESP5815: 'Ceuta', 17 | ESP5816: 'Ciudad Real', 18 | ESP5817: 'Córdoba', 19 | ESP5818: 'Cuenca', 20 | ESP5820: 'Gerona', 21 | ESP5821: 'Granada', 22 | ESP5822: 'Guadalajara', 23 | ESP5823: 'Gipuzkoa', 24 | ESP5824: 'Huelva', 25 | ESP5825: 'Huesca', 26 | ESP5826: 'Jaén', 27 | ESP5827: 'La Coruña', 28 | ESP5828: 'La Rioja', 29 | ESP5829: 'Las Palmas', 30 | ESP5830: 'León', 31 | ESP5831: 'Lérida', 32 | ESP5832: 'Lugo', 33 | ESP5833: 'Madrid', 34 | ESP5834: 'Málaga', 35 | ESP5835: 'Melilla', 36 | ESP5836: 'Murcia', 37 | ESP5837: 'Navarra', 38 | ESP5838: 'Orense', 39 | ESP5839: 'Palencia', 40 | ESP5840: 'Pontevedra', 41 | ESP5841: 'Salamanca', 42 | ESP5842: 'Santa Cruz de Tenerife', 43 | ESP5843: 'Segovia', 44 | ESP5844: 'Sevilla', 45 | ESP5845: 'Soria', 46 | ESP5846: 'Tarragona', 47 | ESP5847: 'Teruel', 48 | ESP5848: 'Toledo', 49 | ESP5849: 'Valencia', 50 | ESP5850: 'Valladolid', 51 | ESP5851: 'Bizkaia', 52 | ESP5852: 'Zamora', 53 | ESP5853: 'Zaragoza' 54 | }; 55 | -------------------------------------------------------------------------------- /data/Turkey/TurkeyStateCodes.tsx: -------------------------------------------------------------------------------- 1 | export const TurkeyStateCodes ={ 2 | "TUR2229": "Aydin", 3 | "TUR2230": "Izmir", 4 | "TUR2238": "Balikesir", 5 | "TUR2239": "Çanakkale", 6 | "TUR2240": "Edirne", 7 | "TUR2241": "Kirklareli", 8 | "TUR2242": "Tekirdag", 9 | "TUR2263": "Bilecik", 10 | "TUR2264": "Bursa", 11 | "TUR2265": "Istanbul", 12 | "TUR2266": "Kocaeli", 13 | "TUR2267": "Sakarya", 14 | "TUR2268": "Bolu", 15 | "TUR2269": "Eskisehir", 16 | "TUR2270": "Kastamonu", 17 | "TUR2271": "Antalya", 18 | "TUR2272": "Afyonkarahisar", 19 | "TUR2273": "Burdur", 20 | "TUR2274": "Denizli", 21 | "TUR2275": "Isparta", 22 | "TUR2276": "Kütahya", 23 | "TUR2277": "Manisa", 24 | "TUR2278": "Mugla", 25 | "TUR2281": "Adiyaman", 26 | "TUR2282": "Elazig", 27 | "TUR2283": "K. Maras", 28 | "TUR2284": "Malatya", 29 | "TUR2285": "Mersin", 30 | "TUR2286": "Kirsehir", 31 | "TUR2287": "Kayseri", 32 | "TUR2288": "Nevsehir", 33 | "TUR2289": "Hatay", 34 | "TUR2290": "Amasya", 35 | "TUR2291": "Çorum", 36 | "TUR2292": "Giresun", 37 | "TUR2293": "Ordu", 38 | "TUR2294": "Sinop", 39 | "TUR2295": "Sivas", 40 | "TUR2296": "Samsun", 41 | "TUR2297": "Tokat", 42 | "TUR2298": "Artvin", 43 | "TUR2299": "Erzurum", 44 | "TUR2300": "Erzincan", 45 | "TUR2301": "Rize", 46 | "TUR2302": "Trabzon", 47 | "TUR2307": "Agri", 48 | "TUR2308": "Bingöl", 49 | "TUR2309": "Diyarbakir", 50 | "TUR2310": "Mus", 51 | "TUR2311": "Bitlis", 52 | "TUR3008": "Ankara", 53 | "TUR3009": "Çankiri", 54 | "TUR3010": "Zinguldak", 55 | "TUR3011": "Konya", 56 | "TUR3012": "Karaman", 57 | "TUR3014": "Usak", 58 | "TUR3016": "Gaziantep", 59 | "TUR3017": "Sanliurfa", 60 | "TUR3018": "Adana", 61 | "TUR3019": "Kinkkale", 62 | "TUR3020": "Nigde", 63 | "TUR3021": "Aksaray", 64 | "TUR3026": "Yozgat", 65 | "TUR3031": "Gümüshane", 66 | "TUR3032": "Bayburt", 67 | "TUR3040": "Kars", 68 | "TUR3041": "Mardin", 69 | "TUR3042": "Batman", 70 | "TUR3043": "Siirt", 71 | "TUR3044": "Sirnak", 72 | "TUR3045": "Tunceli", 73 | "TUR3047": "Hakkari", 74 | "TUR3048": "Van", 75 | "TUR4839": "Ardahan", 76 | "TUR4840": "Iğdir", 77 | "TUR4841": "Kilis", 78 | "TUR4842": "Osmaniye", 79 | "TUR5518": "Yalova", 80 | "TUR5519": "Düzce", 81 | "TUR5520": "Karabük", 82 | "TUR5521": "Bartın" 83 | } -------------------------------------------------------------------------------- /data/Usa/UsaStateCodes.ts: -------------------------------------------------------------------------------- 1 | export const UsaStateCodes = { 2 | "MA": "Massachusetts", 3 | "MN": "Minnesota", 4 | "MT": "Montana", 5 | "ND": "North Dakota", 6 | "HI": "Hawaii", 7 | "ID": "Idaho", 8 | "WA": "Washington", 9 | "AZ": "Arizona", 10 | "CA": "California", 11 | "CO": "Colorado", 12 | "NV": "Nevada", 13 | "NM": "New Mexico", 14 | "OR": "Oregon", 15 | "UT": "Utah", 16 | "WY": "Wyoming", 17 | "AR": "Arkansas", 18 | "IA": "Iowa", 19 | "KS": "Kansas", 20 | "MO": "Missouri", 21 | "NE": "Nebraska", 22 | "OK": "Oklahoma", 23 | "SD": "South Dakota", 24 | "LA": "Louisiana", 25 | "TX": "Texas", 26 | "CT": "Connecticut", 27 | "NH": "New Hampshire", 28 | "RI": "Rhode Island", 29 | "VT": "Vermont", 30 | "AL": "Alabama", 31 | "FL": "Florida", 32 | "GA": "Georgia", 33 | "MS": "Mississippi", 34 | "SC": "South Carolina", 35 | "IL": "Illinois", 36 | "IN": "Indiana", 37 | "KY": "Kentucky", 38 | "NC": "North Carolina", 39 | "OH": "Ohio", 40 | "TN": "Tennessee", 41 | "VA": "Virginia", 42 | "WI": "Wisconsin", 43 | "WV": "West Virginia", 44 | "DE": "Delaware", 45 | "DC": "District of Columbia", 46 | "MD": "Maryland", 47 | "NJ": "New Jersey", 48 | "NY": "New York", 49 | "PA": "Pennsylvania", 50 | "ME": "Maine", 51 | "MI": "Michigan", 52 | "AK": "Alaska" 53 | } -------------------------------------------------------------------------------- /data/World/WorldCountryCodes.ts: -------------------------------------------------------------------------------- 1 | interface Map { 2 | [key: string]: string 3 | } 4 | 5 | export const WorldCountryCodes: Map = { 6 | AF: 'Afghanistan', 7 | AO: 'Angola', 8 | AL: 'Albania', 9 | AE: 'United Arab Emirates', 10 | AR: 'Argentina', 11 | AM: 'Armenia', 12 | AU: 'Australia', 13 | AT: 'Austria', 14 | AZ: 'Azerbaijan', 15 | BI: 'Burundi', 16 | BE: 'Belgium', 17 | BJ: 'Benin', 18 | BF: 'Burkina Faso', 19 | BD: 'Bangladesh', 20 | BG: 'Bulgaria', 21 | BA: 'Bosnia and Herzegovina', 22 | BY: 'Belarus', 23 | BZ: 'Belize', 24 | BO: 'Bolivia', 25 | BR: 'Brazil', 26 | BN: 'Brunei Darussalam', 27 | BT: 'Bhutan', 28 | BW: 'Botswana', 29 | CF: 'Central African Republic', 30 | CA: 'Canada', 31 | CH: 'Switzerland', 32 | CL: 'Chile', 33 | CN: 'China', 34 | CI: "Côte d'Ivoire", 35 | CM: 'Cameroon', 36 | CD: 'Democratic Republic of the Congo', 37 | CG: 'Republic of Congo', 38 | CO: 'Colombia', 39 | CR: 'Costa Rica', 40 | CU: 'Cuba', 41 | CZ: 'Czech Republic', 42 | DE: 'Germany', 43 | DJ: 'Djibouti', 44 | DK: 'Denmark', 45 | DO: 'Dominican Republic', 46 | DZ: 'Algeria', 47 | EC: 'Ecuador', 48 | EG: 'Egypt', 49 | ER: 'Eritrea', 50 | EE: 'Estonia', 51 | ET: 'Ethiopia', 52 | FI: 'Finland', 53 | FJ: 'Fiji', 54 | GA: 'Gabon', 55 | GB: 'United Kingdom', 56 | GE: 'Georgia', 57 | GH: 'Ghana', 58 | GN: 'Guinea', 59 | GM: 'The Gambia', 60 | GW: 'Guinea-Bissau', 61 | GQ: 'Equatorial Guinea', 62 | GR: 'Greece', 63 | GL: 'Greenland', 64 | GT: 'Guatemala', 65 | GY: 'Guyana', 66 | HN: 'Honduras', 67 | HR: 'Croatia', 68 | HT: 'Haiti', 69 | HU: 'Hungary', 70 | ID: 'Indonesia', 71 | IN: 'India', 72 | IE: 'Ireland', 73 | IR: 'Iran', 74 | IQ: 'Iraq', 75 | IS: 'Iceland', 76 | IL: 'Israel', 77 | IT: 'Italy', 78 | JM: 'Jamaica', 79 | JO: 'Jordan', 80 | JP: 'Japan', 81 | KZ: 'Kazakhstan', 82 | KE: 'Kenya', 83 | KG: 'Kyrgyzstan', 84 | KH: 'Cambodia', 85 | KR: 'Republic of Korea', 86 | // "XK": "Kosovo", 87 | KW: 'Kuwait', 88 | LA: 'Lao PDR', 89 | LB: 'Lebanon', 90 | LR: 'Liberia', 91 | LY: 'Libya', 92 | LK: 'Sri Lanka', 93 | LS: 'Lesotho', 94 | LT: 'Lithuania', 95 | LU: 'Luxembourg', 96 | LV: 'Latvia', 97 | MA: 'Morocco', 98 | MD: 'Moldova', 99 | MG: 'Madagascar', 100 | MX: 'Mexico', 101 | MK: 'Macedonia', 102 | ML: 'Mali', 103 | MM: 'Myanmar', 104 | ME: 'Montenegro', 105 | MN: 'Mongolia', 106 | MZ: 'Mozambique', 107 | MR: 'Mauritania', 108 | MW: 'Malawi', 109 | MY: 'Malaysia', 110 | NA: 'Namibia', 111 | NE: 'Niger', 112 | NG: 'Nigeria', 113 | NI: 'Nicaragua', 114 | NL: 'Netherlands', 115 | NO: 'Norway', 116 | NP: 'Nepal', 117 | NZ: 'New Zealand', 118 | OM: 'Oman', 119 | PK: 'Pakistan', 120 | PA: 'Panama', 121 | PE: 'Peru', 122 | PH: 'Philippines', 123 | PG: 'Papua New Guinea', 124 | PL: 'Poland', 125 | KP: 'Dem. Rep. Korea', 126 | PT: 'Portugal', 127 | PY: 'Paraguay', 128 | PS: 'Palestine', 129 | QA: 'Qatar', 130 | RO: 'Romania', 131 | RU: 'Russia', 132 | RW: 'Rwanda', 133 | EH: 'Western Sahara', 134 | SA: 'Saudi Arabia', 135 | SD: 'Sudan', 136 | SS: 'South Sudan', 137 | SN: 'Senegal', 138 | SL: 'Sierra Leone', 139 | SV: 'El Salvador', 140 | RS: 'Serbia', 141 | SR: 'Suriname', 142 | SK: 'Slovakia', 143 | SI: 'Slovenia', 144 | SE: 'Sweden', 145 | SZ: 'Swaziland', 146 | SY: 'Syria', 147 | TD: 'Chad', 148 | TG: 'Togo', 149 | TH: 'Thailand', 150 | TJ: 'Tajikistan', 151 | TM: 'Turkmenistan', 152 | TL: 'Timor-Leste', 153 | TN: 'Tunisia', 154 | TR: 'Turkey', 155 | TW: 'Taiwan', 156 | TZ: 'Tanzania', 157 | UG: 'Uganda', 158 | UA: 'Ukraine', 159 | UY: 'Uruguay', 160 | US: 'United States', 161 | UZ: 'Uzbekistan', 162 | VE: 'Venezuela', 163 | VN: 'Vietnam', 164 | VU: 'Vanuatu', 165 | YE: 'Yemen', 166 | ZA: 'South Africa', 167 | ZM: 'Zambia', 168 | ZW: 'Zimbabwe', 169 | SO: 'Somalia', 170 | GF: 'France', 171 | FR: 'France', 172 | ES: 'Spain', 173 | AW: 'Aruba', 174 | AI: 'Anguilla', 175 | AD: 'Andorra', 176 | AG: 'Antigua and Barbuda', 177 | BS: 'Bahamas', 178 | BM: 'Bermuda', 179 | BB: 'Barbados', 180 | KM: 'Comoros', 181 | CV: 'Cape Verde', 182 | KY: 'Cayman Islands', 183 | DM: 'Dominica', 184 | FK: 'Falkland Islands', 185 | FO: 'Faeroe Islands', 186 | GD: 'Grenada', 187 | HK: 'Hong Kong', 188 | KN: 'Saint Kitts and Nevis', 189 | LC: 'Saint Lucia', 190 | LI: 'Liechtenstein', 191 | // "MF": "Saint Martin (French)", 192 | MV: 'Maldives', 193 | MT: 'Malta', 194 | MS: 'Montserrat', 195 | MU: 'Mauritius', 196 | NC: 'New Caledonia', 197 | NR: 'Nauru', 198 | PN: 'Pitcairn Islands', 199 | PR: 'Puerto Rico', 200 | PF: 'French Polynesia', 201 | SG: 'Singapore', 202 | SB: 'Solomon Islands', 203 | ST: 'São Tomé and Principe', 204 | SX: 'Saint Martin (Dutch)', 205 | SC: 'Seychelles', 206 | TC: 'Turks and Caicos Islands', 207 | TO: 'Tonga', 208 | TT: 'Trinidad and Tobago', 209 | VC: 'Saint Vincent and the Grenadines', 210 | VG: 'British Virgin Islands', 211 | VI: 'United States Virgin Islands', 212 | CY: 'Cyprus', 213 | RE: 'Reunion (France)', 214 | YT: 'Mayotte (France)', 215 | MQ: 'Martinique (France)', 216 | GP: 'Guadeloupe (France)', 217 | CW: 'Curaco (Netherlands)', 218 | IC: 'Canary Islands (Spain)', 219 | }; -------------------------------------------------------------------------------- /data/colors/index.ts: -------------------------------------------------------------------------------- 1 | export const colorPickerPalette: string[][] = [ 2 | [ 3 | '#FCE4EC', '#F8BBD0', 4 | '#F48FB1', '#F06292', 5 | '#EC407A', '#E91E63', 6 | '#D81B60', '#C2185B', 7 | '#AD1457', '#880E4F' 8 | ], 9 | [ 10 | '#F3E5F5', '#E1BEE7', 11 | '#CE93D8', '#BA68C8', 12 | '#AB47BC', '#9C27B0', 13 | '#8E24AA', '#7B1FA2', 14 | '#6A1B9A', '#4A148C' 15 | ], 16 | [ 17 | '#EDE7F6', '#D1C4E9', 18 | '#B39DDB', '#9575CD', 19 | '#7E57C2', '#673AB7', 20 | '#5E35B1', '#512DA8', 21 | '#4527A0', '#311B92' 22 | ], 23 | [ 24 | '#E8EAF6', '#C5CAE9', 25 | '#9FA8DA', '#7986CB', 26 | '#5C6BC0', '#3F51B5', 27 | '#3949AB', '#303F9F', 28 | '#283593', '#1A237E' 29 | ], 30 | [ 31 | '#E3F2FD', '#BBDEFB', 32 | '#90CAF9', '#64B5F6', 33 | '#42A5F5', '#2196F3', 34 | '#1E88E5', '#1976D2', 35 | '#1565C0', '#0D47A1' 36 | ], 37 | [ 38 | '#E0F2F1', '#B2DFDB', 39 | '#80CBC4', '#4DB6AC', 40 | '#26A69A', '#009688', 41 | '#00897B', '#00796B', 42 | '#00695C', '#004D40' 43 | ], 44 | [ 45 | '#F1F8E9', '#DCEDC8', 46 | '#C5E1A5', '#AED581', 47 | '#9CCC65', '#8BC34A', 48 | '#7CB342', '#689F38', 49 | '#558B2F', '#33691E' 50 | ], 51 | [ 52 | '#F9FBE7', '#F0F4C3', 53 | '#E6EE9C', '#DCE775', 54 | '#D4E157', '#CDDC39', 55 | '#C0CA33', '#AFB42B', 56 | '#9E9D24', '#827717' 57 | ], 58 | [ 59 | '#FFF3E0', '#FFE0B2', 60 | '#FFCC80', '#FFB74D', 61 | '#FFA726', '#FF9800', 62 | '#FB8C00', '#F57C00', 63 | '#EF6C00', '#E65100' 64 | ], 65 | [ 66 | '#FBE9E7', '#FFCCBC', 67 | '#FFAB91', '#FF8A65', 68 | '#FF7043', '#FF5722', 69 | '#F4511E', '#E64A19', 70 | '#D84315', '#BF360C' 71 | ], 72 | [ 73 | '#EFEBE9', '#D7CCC8', 74 | '#BCAAA4', '#A1887F', 75 | '#8D6E63', '#795548', 76 | '#6D4C41', '#5D4037', 77 | '#4E342E', '#3E2723' 78 | ], 79 | [ 80 | '#FAFAFA', '#F5F5F5', 81 | '#EEEEEE', '#E0E0E0', 82 | '#BDBDBD', '#9E9E9E', 83 | '#757575', '#616161', 84 | '#424242', '#212121' 85 | ] 86 | ] -------------------------------------------------------------------------------- /data/europe/EuropeCountryCode.tsx: -------------------------------------------------------------------------------- 1 | export const EuropeCountryCodes = { 2 | AL: 'Albania', 3 | AM: 'Armenia', 4 | AT: 'Austria', 5 | BE: 'Belgium', 6 | BG: 'Bulgaria', 7 | BA: 'Bosnia and Herz.', 8 | BY: 'Belarus', 9 | CH: 'Switzerland', 10 | CZ: 'Czech Rep.', 11 | DE: 'Germany', 12 | DK: 'Denmark', 13 | EE: 'Estonia', 14 | FI: 'Finland', 15 | GB: 'United Kingdom', 16 | GE: 'Georgia', 17 | GR: 'Greece', 18 | HR: 'Croatia', 19 | HU: 'Hungary', 20 | IE: 'Ireland', 21 | IS: 'Iceland', 22 | IT: 'Italy', 23 | LT: 'Lithuania', 24 | LU: 'Luxembourg', 25 | LV: 'Latvia', 26 | MD: 'Moldova', 27 | MK: 'Macedonia', 28 | ME: 'Montenegro', 29 | NL: 'Netherlands', 30 | NO: 'Norway', 31 | PL: 'Poland', 32 | PT: 'Portugal', 33 | RO: 'Romania', 34 | RS: 'Serbia', 35 | SK: 'Slovakia', 36 | SI: 'Slovenia', 37 | SE: 'Sweden', 38 | UA: 'Ukraine', 39 | FR: 'France', 40 | ES: 'Spain', 41 | TR: 'Turkey', 42 | XK: 'Kosovo', 43 | CY: 'Cyprus' 44 | }; 45 | -------------------------------------------------------------------------------- /data/germany/GermanyStateCodes.ts: -------------------------------------------------------------------------------- 1 | export const GermanyStateCodes = { 2 | "DEU1572": "Nordrhein-Westfalen", 3 | "DEU1573": "Baden-Württemberg", 4 | "DEU1574": "Hessen", 5 | "DEU1575": "Bremen", 6 | "DEU1576": "Niedersachsen", 7 | "DEU1577": "Thüringen", 8 | "DEU1578": "Hamburg", 9 | "DEU1579": "Schleswig-Holstein", 10 | "DEU1580": "Rheinland-Pfalz", 11 | "DEU1581": "Saarland", 12 | "DEU1591": "Bayern", 13 | "DEU1599": "Berlin", 14 | "DEU1600": "Sachsen-Anhalt", 15 | "DEU1601": "Sachsen", 16 | "DEU3487": "Brandenburg", 17 | "DEU3488": "Mecklenburg-Vorpommern" 18 | } -------------------------------------------------------------------------------- /data/russia/RussiaStateCodes.ts: -------------------------------------------------------------------------------- 1 | export const RussiaStateCodes = { 2 | "RUS2167": "Tomsk", 3 | "RUS2279": "Adygey", 4 | "RUS2280": "Karachay-Cherkess", 5 | "RUS2303": "Ingush", 6 | "RUS2304": "Kabardin-Balkar", 7 | "RUS2305": "North Ossetia", 8 | "RUS2306": "Stavropol'", 9 | "RUS2321": "Chukchi Autonomous Okrug", 10 | "RUS2324": "Kaliningrad", 11 | "RUS2333": "Murmansk", 12 | "RUS2334": "Novgorod", 13 | "RUS2335": "Pskov", 14 | "RUS2336": "Leningrad", 15 | "RUS2337": "City of St. Petersburg", 16 | "RUS2342": "Bryansk", 17 | "RUS2343": "Smolensk", 18 | "RUS2353": "Karelia", 19 | "RUS2354": "Arkhangel'sk", 20 | "RUS2355": "Ivanovo", 21 | "RUS2356": "Kostroma", 22 | "RUS2357": "Nizhegorod", 23 | "RUS2358": "Tver'", 24 | "RUS2359": "Vologda", 25 | "RUS2360": "Yaroslavl'", 26 | "RUS2361": "Kaluga", 27 | "RUS2362": "Kursk", 28 | "RUS2363": "Lipetsk", 29 | "RUS2364": "Moskovsskaya", 30 | "RUS2365": "Moskva", 31 | "RUS2366": "Orel", 32 | "RUS2367": "Rostov", 33 | "RUS2368": "Tula", 34 | "RUS2369": "Volgograd", 35 | "RUS2370": "Belgorod", 36 | "RUS2371": "Krasnodar", 37 | "RUS2372": "Mordovia", 38 | "RUS2373": "Penza", 39 | "RUS2374": "Ryazan'", 40 | "RUS2375": "Tambov", 41 | "RUS2376": "Vladimir", 42 | "RUS2377": "Voronezh", 43 | "RUS2378": "Bashkortostan", 44 | "RUS2379": "Chelyabinsk", 45 | "RUS2380": "Kurgan", 46 | "RUS2381": "Nenets", 47 | "RUS2382": "Yamal-Nenets", 48 | "RUS2383": "Komi", 49 | "RUS2384": "Kirov", 50 | "RUS2385": "Mariy-El", 51 | "RUS2386": "Sverdlovsk", 52 | "RUS2387": "Udmurt", 53 | "RUS2388": "Astrakhan'", 54 | "RUS2389": "Chuvash", 55 | "RUS2390": "Kalmyk", 56 | "RUS2391": "Orenburg", 57 | "RUS2392": "Samara", 58 | "RUS2393": "Saratov", 59 | "RUS2394": "Tatarstan", 60 | "RUS2395": "Ul'yanovsk", 61 | "RUS2396": "Khanty-Mansiy", 62 | "RUS2397": "Omsk", 63 | "RUS2398": "Tyumen'", 64 | "RUS2399": "Altay", 65 | "RUS2400": "Gorno-Altay", 66 | "RUS2401": "Kemerovo", 67 | "RUS2402": "Khakass", 68 | "RUS2403": "Novosibirsk", 69 | "RUS2416": "Chechnya", 70 | "RUS2417": "Dagestan", 71 | "RUS2602": "Irkutsk", 72 | "RUS2603": "Krasnoyarsk", 73 | "RUS2605": "Tuva", 74 | "RUS2606": "Buryat", 75 | "RUS2609": "Amur", 76 | "RUS2610": "Chita", 77 | "RUS2611": "Primor'ye", 78 | "RUS2612": "Sakha (Yakutia)", 79 | "RUS2613": "Yevrey", 80 | "RUS2614": "Khabarovsk", 81 | "RUS2615": "Maga Buryatdan", 82 | "RUS2616": "Sakhalin", 83 | "RUS3200": "Perm'", 84 | "RUS3468": "Kamchatka" 85 | } -------------------------------------------------------------------------------- /data/sweden/SwedenStateCode.ts: -------------------------------------------------------------------------------- 1 | export const SwedenStateCodes = { 2 | "SWE178": "Gävleborg", 3 | "SWE179": "Jönköping", 4 | "SWE180": "Kalmar", 5 | "SWE181": "Dalarna", 6 | "SWE182": "Kronoberg", 7 | "SWE183": "Orebro", 8 | "SWE184": "Östergötland", 9 | "SWE185": "Södermanland", 10 | "SWE186": "Västmanland", 11 | "SWE187": "Halland", 12 | "SWE188": "Värmland", 13 | "SWE189": "Jämtland", 14 | "SWE190": "Norrbotten", 15 | "SWE191": "Västernorrland", 16 | "SWE192": "Västerbotten", 17 | "SWE193": "Gotland", 18 | "SWE194": "Stockholm", 19 | "SWE195": "Uppsala", 20 | "SWE262": "Blekinge", 21 | "SWE3428": "Västra Götaland", 22 | "SWE3429": "Skåne" 23 | } -------------------------------------------------------------------------------- /data/version.ts: -------------------------------------------------------------------------------- 1 | const version =`v0.4.0-alpha`; 2 | 3 | export default version; -------------------------------------------------------------------------------- /genMapFiles.js: -------------------------------------------------------------------------------- 1 | const chalk = require('chalk'); 2 | const fs = require('fs'); 3 | 4 | const country = process.argv[2]; 5 | const viewBoxW = process.argv[3]; 6 | const viewBoxH = process.argv[4]; 7 | 8 | const capFirst = (str) => str.charAt(0).toUpperCase() + str.slice(1); 9 | 10 | const capName = capFirst(country); 11 | 12 | const dir = `./data/${capName}`; 13 | 14 | const svgData = fs.readFileSync(`./temp/map.svg`, 'utf8', (err, data) => { 15 | if (err) { 16 | console.error(err); 17 | return; 18 | } 19 | return data; 20 | }); 21 | const stateData = fs.readFileSync(`./temp/map.data`, 'utf8', (err, data) => { 22 | if (err) { 23 | console.error(err); 24 | return; 25 | } 26 | return data; 27 | }); 28 | 29 | const filesArr = [ 30 | { 31 | file: `${capName}.map.tsx`, 32 | content: ` 33 | import MapLayout from '@/layouts/MapLayout'; 34 | import React from 'react'; 35 | import { ${capName}StateCodes } from './${capName}StateCodes'; 36 | 37 | const ${capName}Map = () => ( 38 | 39 | ${svgData} 40 | 41 | ); 42 | 43 | export default ${capName}Map; 44 | ` 45 | }, 46 | { 47 | file: `${capName}StateCodes.tsx`, 48 | content: `export const ${capName}StateCodes ={ 49 | ${stateData} 50 | }` 51 | } 52 | ]; 53 | 54 | const genTemplate = (country) => { 55 | // Create folder 56 | if (!fs.existsSync(dir)) { 57 | fs.mkdirSync(dir); 58 | filesArr.forEach((el) => { 59 | fs.writeFile( 60 | `${dir}/${el.file}`, 61 | el.content, 62 | { 63 | encoding: 'utf8', 64 | flag: 'w', 65 | mode: 0o666 66 | }, 67 | (err) => { 68 | if (err) console.log(err); 69 | else { 70 | console.log(chalk.green(`Created: ${chalk.blue.bold(el.file)}`)); 71 | } 72 | } 73 | ); 74 | }); 75 | // Generate Pages file 76 | fs.writeFile( 77 | `./pages/map/${country}.tsx`, 78 | `import ControlContainer from '@/components/ControlContainer'; 79 | import MapSEO from '@/components/Seo/MapSEO'; 80 | import ${capName}Map from '@/data/${capName}/${capName}.map'; 81 | import { ${capName}StateCodes } from '@/data/${capName}/${capName}StateCodes'; 82 | import MainLayout from '@/layouts/MainLayout'; 83 | import React from 'react'; 84 | 85 | const ${capName} = () => ( 86 | 87 | 88 |
89 | 90 | <${capName}Map /> 91 |
92 | 93 | ); 94 | 95 | export default ${capName};`, 96 | { 97 | encoding: 'utf8', 98 | flag: 'w', 99 | mode: 0o666 100 | }, 101 | (err) => { 102 | if (err) console.log(err); 103 | else { 104 | console.log(chalk.green(`Created: ${chalk.blue.bold(`pages/${country}.tsx`)}`)); 105 | } 106 | } 107 | ); 108 | } else { 109 | console.log(chalk.red('Folder Already Exists')); 110 | console.log(chalk.red('Delete and Run the Script Again ')); 111 | } 112 | }; 113 | 114 | const noArgsFunc = () => { 115 | console.log(chalk.red(`Please Pass Map Name as an Argument.`)); 116 | console.log(chalk.blue('Example :')); 117 | console.log(chalk.green('yarn generate india 1000 1000 \n')); 118 | }; 119 | 120 | country !== undefined ? genTemplate(country.toLowerCase()) : noArgsFunc(); 121 | module.exports = genTemplate; 122 | -------------------------------------------------------------------------------- /hooks/use-drag-drop.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-explicit-any */ 2 | import React from 'react' 3 | 4 | export interface DragDropType { 5 | x: number; 6 | y: number; 7 | coords: { 8 | x: number; 9 | y: number; 10 | } 11 | } 12 | 13 | const useDragDrop = () => { 14 | const [position, setPosition] = React.useState({ x: 0, y: 0, coords: { x: 0, y: 0 } }); 15 | 16 | const handleMouseMove = React.useRef((e: any) => { 17 | setPosition((pos) => { 18 | const xDiff = pos.coords.x - e.pageX; 19 | const yDiff = pos.coords.y - e.pageY; 20 | return { 21 | x: pos.x - xDiff, 22 | y: pos.y - yDiff, 23 | coords: { 24 | x: e.pageX, 25 | y: e.pageY 26 | } 27 | }; 28 | }); 29 | }); 30 | 31 | const handleMouseDown = (e: any) => { 32 | const { pageX } = e; 33 | const { pageY } = e; 34 | setPosition((pos) => ({ 35 | ...pos, 36 | coords: { 37 | x: pageX, 38 | y: pageY 39 | } 40 | })); 41 | document.addEventListener('mousemove', handleMouseMove.current); 42 | }; 43 | 44 | const handleMouseUp = () => { 45 | document.removeEventListener('mousemove', handleMouseMove.current); 46 | setPosition((pos) => ({ ...pos, coords: { x: 0, y: 0 } })); 47 | }; 48 | 49 | 50 | 51 | return [position , setPosition , handleMouseDown , handleMouseUp] 52 | } 53 | 54 | export default useDragDrop; -------------------------------------------------------------------------------- /hooks/use-drag.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-shadow */ 2 | /* eslint-disable @typescript-eslint/no-explicit-any */ 3 | import React from 'react'; 4 | 5 | const useDrag = (svgRef: any) => { 6 | let selectedElement: any = false; 7 | // Refer: https://www.petercollingridge.co.uk/tutorials/svg/interactive/dragging/ 8 | const makeDraggable = React.useCallback((evt: React.SyntheticEvent) => { 9 | const svg = evt.target as SVGGraphicsElement; 10 | let offset: { 11 | x: number; 12 | y: number; 13 | }; 14 | const drag = (evt: any) => { 15 | if (selectedElement) { 16 | evt.preventDefault(); 17 | const coord = getMousePosition(evt); 18 | selectedElement.setAttributeNS(null, 'x', coord.x - offset.x); 19 | selectedElement.setAttributeNS(null, 'y', coord.y - offset.y); 20 | } 21 | }; 22 | const endDrag = () => { 23 | selectedElement = null; 24 | }; 25 | const getMousePosition = (evt: any) => { 26 | const CTM = svg.getScreenCTM(); 27 | return { 28 | x: (evt.clientX - CTM!.e) / CTM!.a, 29 | y: (evt.clientY - CTM!.f) / CTM!.d 30 | }; 31 | }; 32 | const startDrag = (evt: any) => { 33 | if (evt.target.classList.contains('draggable')) { 34 | selectedElement = evt.target; 35 | offset = getMousePosition(evt); 36 | offset.x -= parseFloat(selectedElement.getAttributeNS(null, 'x')); 37 | offset.y -= parseFloat(selectedElement.getAttributeNS(null, 'y')); 38 | } 39 | }; 40 | svg.addEventListener('mousedown', startDrag); 41 | svg.addEventListener('mousemove', drag); 42 | svg.addEventListener('mouseup', endDrag); 43 | svg.addEventListener('mouseleave', endDrag); 44 | }, []); 45 | 46 | React.useEffect(() => { 47 | const refConst = svgRef.current; 48 | if (svgRef !== undefined && svgRef !== null) { 49 | refConst?.addEventListener('load', makeDraggable); 50 | } 51 | return () => { 52 | refConst?.removeEventListener('load', makeDraggable); 53 | }; 54 | }, [makeDraggable, svgRef]); 55 | }; 56 | 57 | export default useDrag; 58 | -------------------------------------------------------------------------------- /hooks/use-render.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-plusplus */ 2 | /* eslint-disable no-console */ 3 | import React from 'react' 4 | 5 | const useRender = (comp?: string) => { 6 | comp = comp || 'Component' 7 | const renderCount = React.useRef(0) 8 | console.log(`${comp} rendered : ${renderCount.current++} times .. `) 9 | return renderCount.current 10 | } 11 | 12 | export default useRender; -------------------------------------------------------------------------------- /layouts/MainLayout.tsx: -------------------------------------------------------------------------------- 1 | /* eslint-disable react/require-default-props */ 2 | import Navbar from '@/components/Navbar'; 3 | import Footer from '@/components/Footer'; 4 | import React from 'react'; 5 | import Banner from '@/components/Banner'; 6 | 7 | interface Props { 8 | children: React.ReactNode; 9 | showNav?: boolean; 10 | } 11 | 12 | const MainLayout = ({ children, showNav = false }: Props) => ( 13 | <> 14 | 15 | 18 | 19 |
20 |
{children}
21 |
22 | 23 |