This short tutorial will show how you can use MapChart with a version of world map that is compatible with regulations in place in India.
Regulations in India require contested areas to be shown as part of the country as a whole. Unfortunately, those border lines do not correspond with areas of direct control.
This is our default map world* (e.g. worldLow) shows UN-mandated version of borders.
To solve this specific issue, amCharts 4 comes with a specific version of world map, called worldIndia*.
So, to use Indian version of the world map, all you need to do is to import/include and use worldIndia map instead of world one.
chart . geodata = am4geodata_worldIndiaLow;
chart . geodata = am4geodata_worldIndiaLow ;
"geodata" : " worldIndiaLow "
geodata = am4geodata_worldLowgeodata = am4geodata_worldIndiaLow
Run * ---------------------------------------
* This demo was created using amCharts 4.
* For more information visit:
* https://www.amcharts.com/
* Documentation is available at:
* https://www.amcharts.com/docs/v4/
* ---------------------------------------
var chart = am4core . create ( " chartdiv " , am4maps . MapChart );
chart . geodata = am4geodata_worldIndiaLow ;
chart . projection = new am4maps . projections . Miller ();
// Create map polygon series
var polygonSeries = chart . series . push ( new am4maps . MapPolygonSeries ());
polygonSeries . exclude = [ " AQ " ];
// Make map load polygon (like country names) data from GeoJSON
polygonSeries . useGeodata = true ;
var polygonTemplate = polygonSeries . mapPolygons . template ;
polygonTemplate . tooltipText = " {name} " ;
polygonTemplate . fill = am4core . color ( " #74B266 " );
// Create hover state and set alternative fill color
var hs = polygonTemplate . states . create ( " hover " );
hs . properties . fill = am4core . color ( " #367B25 " );
chart . events . on ( " ready " , function ( ev ) {
polygonSeries . getPolygonById ( " IN " ) . isHover = true ;
< div id = " chartdiv " ></ div >
-apple-system , BlinkMacSystemFont, " Segoe UI " , Roboto, Helvetica , Arial , sans-serif ,
" Apple Color Emoji " , " Segoe UI Emoji " , " Segoe UI Symbol " ;
India world map india-world-map