Google Maps API V3: Bound world to fit area and disable map repeat

Question

Setting the center: new google.maps.LatLng(0,0) will set the center of the world. And zoom: 1 makes the default zoom to whole world.

Question is, given the size 616px by 310px of the map how can we modify/resize the map so it fits the given size nicely. For example only one instance of world gets shown and bottom of the map will be the bottom of Africa. So subsequently world map will not repeat. To be precise making our map bound like this:

This is what I have got so far:

Answer 1

The 'picture' of the whole world has a constant size at a given zoom level. For zoom level 1 it's 512 pixels, for zoom level 2 1024, 3 = 2048 , 4 = 4096 etc ...

To fit the whole world without repeating it you need to have a map div that is smaller than the picture of the whole world at this zoom level, otherwise it won't work.

For zoom level 1 the map would need to 512 to fit ideally and less not to wrap.

https://output.jsbin.com/vabago is a sample that shows the world width at given zoom levels and logs it to the console. It also resizes the map to fit the whole world when you zoom in (a silly thing to do usually, but here it just shows how this works).

HTH