Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Display a map and highlight certain countries

Here's what I'm struggling to do : Display a map on page (Google map or any of it competitors, free is possible...) and highlight certain countries on this map (the list of theses countries would be stored in a variable by exemple).

I tried to draw polygons on the map with a geo-json list of (almost) all the countries but it's too heavy.

Any ideas ?

like image 474
mdcarter Avatar asked Oct 02 '12 18:10

mdcarter


People also ask

How do I highlight a specific country in Google Maps?

To achieve this, you will basically need to look for the coordinates of the state or country on GADM. Once you have them, draw a shape on the Google Maps with the Polygon object providing an array with all the coordinates that play basically as borders of the place that you want to highlight.

How do I show only one country map in tableau?

In the Marks Card, change the kind of chart to “Filled Map”. Then, click in “Map”, then “Map Layers” and untick all the boxes that will appear in the left: “Base”, “Land Cover”, “Country/Region Name”, “State/Province Border”. Once you have unticked all those boxes, you will have only the US shape.

How do I create a custom map?

Start by heading to maps.google.com. Click on the menu icon on the top left hand side of the screen and select “Your Places.” (The menu icon is just to the left of the search bar on the top left hand side of your screen.) Select the maps tab. Navigate to the very bottom of that window and select “Create a Map.”


3 Answers

I believe you will need a polygon to do that.

http://code.google.com/apis/maps/documentation/overlays.html#Polygons_Overview
http://code.google.com/apis/maps/documentation/reference.html#GPolygon

like this sample: http://gmaps-samples-v3.googlecode.com/svn/trunk/poly/pentagon.html

sample

Or check this site that can do all the hard work for you :)
http://www.dyngeometry.com/web/WorldRegion.aspx

ss

Finally, there is also Google Geochart
Check it here: https://developers.google.com/chart/interactive/docs/gallery/geochart

gc

like image 171
RASG Avatar answered Oct 19 '22 17:10

RASG


You can create very complex polygons in Maps without a drop in performance if you store them in KML file format and load them as KmlLayers. KML is an XML based vector file format for geo data. The beauty of using KML files in Google Maps is that they are rendered on Google servers into simple PNG files, matching the current resolution and bounding box of your Maps view at any time, no matter how complex the original polygon data is. So all complexity is handled server side at Google.

Here is a sample of a project, where I have used a KML mask for one of the federal states of Germany.

For a quick review KML files can also be loaded directly into the Google Maps public website (by entering their URL into the search field). Here is the KML file that I have used in the above project, loaded directly into Google Maps. (I have actually used a KMZ file here, but that is simply a KML file packed into a ZIP archive. You can pack and unpack it with normal ZIP tools.) [UPDATE: This does not work anymore in the new Maps version (started in 2014).]

Please be aware that Google implies a size limit to KML/KMZ files (currently 10 Mb uncompressed, 3 Mb compressed - details see here). If your KML files should be to large, there is software available to reduce the complexity (see examples here and here).

Please notice that KML files are only a solution if your polygons are static (like the borders of countries or cities) and not generated on the fly (e.g. depending on any user input). For dynamic polygons you will still have to use the Polygon class of the Maps API with the complexity restrictions that you have mentioned. (But you are still free to use KML layers and switch them on and off depending on user input, as long as the polygon details don't have to change.)

like image 34
Jpsy Avatar answered Oct 19 '22 17:10

Jpsy


If you need just a boundaries of the countries with different colors you can try jVectorMap.

like image 24
bjornd Avatar answered Oct 19 '22 17:10

bjornd