countries_world_map 1.0.3 icon indicating copy to clipboard operation
countries_world_map: ^1.0.3 copied to clipboard

A simple widget for a customizable WorldMap (or any country of choice). Which can all be colored based on the ISO two-letter countrycodes (or state ID).

countries_world_map #

This package provides an easy to implement World Map (or any other country of choice) which is fully customizable. In this case "customizable" means the ability to change the color of a country/state/prefecture/province. Additionally when a country is touched the map provides a callback.

Example

Online example is available at countriesworldmap.simplewidgets.dev

Support #

To see which countries are supported, please see the online example or the list below.

About this package #

This flutter package draws a map of choice using the CustomPainter. These maps can be quite big so please read "Perfomance" below. When tapping a area on the map (country, state etc.) you will get a callback providing you with the name, id and tapdetails of the area being tapped.

How to use the widget #

The main widget is the SimpleMap() widget which requires at least the instructions on how to draw the map. For all supported countries there are 2 classes SMap...() & SMap...Colors(). The first class only contains a static String which has the instructions for the SimpleMap widget. The second class has color properties that match with the ID's given to the area's in the instructions.

For example:

  • Spain has the following classes: SMapSpain() & SMapSpainColors().
  • Mexico has the following classes: SmapMexico() & SMapMexicoColors().
  • The World Map has the following classes: SMapWorld() & SMapWorldColors().
SimpleMap(
    // String of instructions to draw the map.
    instructions: SMapWorld.instructions, 


    // Default color for all countries.
    defaultColor: Colors.grey,       


    // Matching class to specify custom colors for each area.
    colors: SMapWorldColors( 
        uS: Colors.green,   // This makes USA green
        cN: Colors.green,   // This makes China green
        ru: Colors.green,   // This makes Russia green
     ).toMap(), 


    // Details of what area is being touched, giving you the ID, name and tapdetails
    callback: (id, name, tapdetails) {      
        print(id); 
    },
);

❗️ Please note: ID structure might be different between countries. The Color class and the instructions should always match, but there might be differences between different countries. When adding a map check how the ID is returned. Or open the online example to see the ID's in the right list.

Use cases #

This packages can be used to visualize data by adding different shades of colors. When pressing a region you might want to show a bottomsheet containing more details.

Although it it possible to add multiple maps to your app, please read more about the performance before proceeding.

Tips for UI #

  1. Wrap the WorldMap in an InteractiveViewer widget.

    Using InteractiveView enables you to zoom in and out on specific countries as done in the online example. In the example the InteractiveViewer has a maxScale of 75.

  2. Set the WorldMap to 92% of the available width to make it look more centered.

Performance #

Some of the maps are really big, so (re)building the widget can be expensive. That's why the default Widget uses a RepaintBoundry to prevent it from unnecessary repaints. If you change a Country Color and call SetState() the widget will repaint.

In version 0.0.7 and before the size of the map would cause jank and compile errors. In the newer versions this should be fixed. However, if you plan on showing a lot of maps in your app. Please be advised and consider using Google Maps or Apple Maps instead, this because each map added to the app will increase the size of the final build.

Like to contribute? #

Feel free to help us improve this package by creating issues, pull request etc. For any questions you can email hello@simplewidgets.dev

Countries with Maps #

COUNTRYISOSUPPORTED
AfghanistanAF
AlbaniaAL
AlgeriaDZ
American SamoaAS
AndorraAD
AngolaAO
AnguillaAI
AntarcticaAQ
Antigua and BarbudaAG
ArgentinaAR
ArmeniaAM
ArubaAW
AustraliaAU
AustriaAT
AzerbaijanAZ
Bahamas (the)BS
BahrainBH
BangladeshBD
BarbadosBB
BelarusBY
BelgiumBE
BelizeBZ
BeninBJ
BermudaBM
BhutanBT
Bolivia (Plurinational State of)BO
Bonaire, Sint Eustatius and SabaBQ
Bosnia and HerzegovinaBA
BotswanaBW
Bouvet IslandBV
BrazilBR
British Indian Ocean Territory (the)IO
Brunei DarussalamBN
BulgariaBG
Burkina FasoBF
BurundiBI
Cabo VerdeCV
CambodiaKH
CameroonCM
CanadaCA
Cayman Islands (the)KY
Central African Republic (the)CF
ChadTD
ChileCL
ChinaCN
Christmas IslandCX
Cocos (Keeling) Islands (the)CC
ColombiaCO
Comoros (the)KM
Congo (the Democratic Republic of the)CD
Congo (the)CG
Cook Islands (the)CK
Costa RicaCR
CroatiaHR
CubaCU
CuraçaoCW
CyprusCY
CzechiaCZ
Côte d'IvoireCI
DenmarkDK
DjiboutiDJ
DominicaDM
Dominican Republic (the)DO
EcuadorEC
EgyptEG
El SalvadorSV
Equatorial GuineaGQ
EritreaER
EstoniaEE
EswatiniSZ
EthiopiaET
Falkland Islands (the) [Malvinas]FK
Faroe Islands (the)FO
FijiFJ
FinlandFI
FranceFR
French GuianaGF
French PolynesiaPF
French Southern Territories (the)TF
GabonGA
Gambia (the)GM
GeorgiaGE
GermanyDE
GhanaGH
GibraltarGI
GreeceGR
GreenlandGL
GrenadaGD
GuadeloupeGP
GuamGU
GuatemalaGT
GuernseyGG
GuineaGN
Guinea-BissauGW
GuyanaGY
HaitiHT
Heard Island and McDonald IslandsHM
Holy See (the)VA
HondurasHN
Hong KongHK
HungaryHU
IcelandIS
IndiaIN
IndonesiaID
Iran (Islamic Republic of)IR
IraqIQ
IrelandIE
Isle of ManIM
IsraelIL
ItalyIT
JamaicaJM
JapanJP
JerseyJE
JordanJO
KazakhstanKZ
KenyaKE
KiribatiKI
Korea (the Democratic People's Republic of)KP
Korea (the Republic of)KR
KosovoXK
KuwaitKW
KyrgyzstanKG
Lao People's Democratic Republic (the)LA
LatviaLV
LebanonLB
LesothoLS
LiberiaLR
LibyaLY
LiechtensteinLI
LithuaniaLT
LuxembourgLU
MacaoMO
MadagascarMG
MalawiMW
MalaysiaMY
MaldivesMV
MaliML
MaltaMT
Marshall Islands (the)MH
MartiniqueMQ
MauritaniaMR
MauritiusMU
MayotteYT
MexicoMX
Micronesia (Federated States of)FM
Moldova (the Republic of)MD
MonacoMC
MongoliaMN
MontenegroME
MontserratMS
MoroccoMA
MozambiqueMZ
MyanmarMM
NamibiaNA
NauruNR
NepalNP
Netherlands (the)NL
New CaledoniaNC
New ZealandNZ
NicaraguaNI
Niger (the)NE
NigeriaNG
NiueNU
Norfolk IslandNF
Northern Mariana Islands (the)MP
NorwayNO
OmanOM
PakistanPK
PalauPW
Palestine, State ofPS
PanamaPA
Papua New GuineaPG
ParaguayPY
PeruPE
Philippines (the)PH
PitcairnPN
PolandPL
PortugalPT
Puerto RicoPR
QatarQA
Republic of North MacedoniaMK
RomaniaRO
Russian Federation (the)RU
RwandaRW
RéunionRE
Saint BarthélemyBL
Saint Helena, Ascension and Tristan da CunhaSH
Saint Kitts and NevisKN
Saint LuciaLC
Saint Martin (French part)MF
Saint Pierre and MiquelonPM
Saint Vincent and the GrenadinesVC
SamoaWS
San MarinoSM
Sao Tome and PrincipeST
Saudi ArabiaSA
SenegalSN
SerbiaRS
SeychellesSC
Sierra LeoneSL
SingaporeSG
Sint Maarten (Dutch part)SX
SlovakiaSK
SloveniaSI
Solomon IslandsSB
SomaliaSO
South AfricaZA
South Georgia and the South Sandwich IslandsGS
South SudanSS
SpainES
Sri LankaLK
Sudan (the)SD
SurinameSR
Svalbard and Jan MayenSJ
SwedenSE
SwitzerlandCH
Syrian Arab RepublicSY
Taiwan (Province of China)TW
TajikistanTJ
Tanzania, United Republic ofTZ
ThailandTH
Timor-LesteTL
TogoTG
TokelauTK
TongaTO
Trinidad and TobagoTT
TunisiaTN
TurkeyTR
TurkmenistanTM
Turks and Caicos Islands (the)TC
TuvaluTV
UgandaUG
UkraineUA
United Arab Emirates (the)AE
United Kingdom of Great Britain and Northern Ireland (the)GB
United States Minor Outlying Islands (the)UM
United States of America (the)US
UruguayUY
UzbekistanUZ
VanuatuVU
Venezuela (Bolivarian Republic of)VE
Viet NamVN
Virgin Islands (British)VG
Virgin Islands (U.S.)VI
Wallis and FutunaWF
Western SaharaEH
YemenYE
ZambiaZM
ZimbabweZW
Åland IslandsAX
22
likes
140
pub points
80%
popularity

Publisher

verified publisher iconsimplewidgets.dev

A simple widget for a customizable WorldMap (or any country of choice). Which can all be colored based on the ISO two-letter countrycodes (or state ID).

Repository (GitHub)

Documentation

API reference

License

Icon for licenses.MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on countries_world_map