Is there a way to display a single country in Google map? It should be only one country, not parts from other countries included [duplicate]

This question already has an answer here: Country specific zoom level in Google Maps API (1 answer) Closed 1 year开发者_如何学Python ago.

I need to display only a single country in google map. I need to display only one country and the parts of other countries should not be there.. for example if I want to display U.K. it should display only UK and sea around, no parts from other countries should be visible.

Is there a Google API call or any other method? I couldn't find a method than overriding zoom and overriding the methods they can navigate over the region (scrolling events).

Does anyone know a method to do this?

---

If you disable all map elements and then a add new layer (a single country), then only one country is visible. Here is a jsfiddle https://jsfiddle.net/gvvy5vxz/2/

function initialize() {
    var mapOptions = {
    zoom: 5,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    backgroundColor: '#FFF',
    disableDefaultUI: true,
    draggable: false,
    scaleControl: false,
    scrollwheel: false,
    styles: [
    {
    "featureType": "water",
    "elementType": "geometry",
    "stylers": [
      { "visibility": "off" }
    ]
    },{
    "featureType": "landscape",
    "stylers": [
      { "visibility": "off" }
    ]
    },{
    "featureType": "road",
    "stylers": [
      { "visibility": "off" }
    ]
    },{
    "featureType": "administrative",
    "stylers": [
      { "visibility": "off" }
    ]
    },{
    "featureType": "poi",
    "stylers": [
      { "visibility": "off" }
    ]
    },{
    "featureType": "administrative",
    "stylers": [
      { "visibility": "off" }
    ]
    },{
    "elementType": "labels",
    "stylers": [
      { "visibility": "off" }
    ]
    }
  ]
};

---

I was looking for the same thing and ended up using polygon overlay.

Relevant code is under "here is the magic" comment.

Zoom out all the way and you will see the giant white square. This is the 0th index of the array in the json file (linked in map.data.loadGeoJson) "[[-147, 2], [-150, 70], [-20, 68], [-31, 5], [-147, 2]]", the next index is the border coordinate points of the region you're interested in.

Search for "kml {country/city/state/region name}" in google and you'll probably find all that data with the border outline points.

https://jsfiddle.net/jmao2o3o/3/

//here is the magic
map.data.loadGeoJson('https://bitbucket.org/dimaboychev/public/raw/9bb53aba0d70875a6d2d9bd2a1eec65671ce4ae3/dc.json');

---

Even I had a similar requirement, and after a lot of searching, I found this

<style>
        #visualization svg path[fill^='none'] {
            stroke-width: 0px;
        }
</style>

[Note: #visualization is the id of the tag where we render the graph.]

It basically, decreases the stroke width for other countries, also do not forget to put this

var options = {
                ...,
                ...,
                datalessRegionColor: 'transparent',
                ...,
                ...
            };

in the options part of the visualization.