Adding transparent overlay on google map

I was looking at apartment listings when I came 开发者_开发问答across this,

And I am wondering how it is achieved?

EDIT:

Found the image overlay using inspect element. Question is, is there an api to do things like this?

---

You can implement a custom map type with the help of the ImageMapType object. You can implement it to returned a darkened/half-transparent images for the map tiles. You can then overlay this map type over the normal one like so.

---

The answer would be no. There's no API for adding fixed images over a google map. Why? Because it's the standard behavior for any div (if you want to mimic what they did, just put a div after the map div and position it absolutely...in this case top:0 and left:0 with 100% width and a gradient or static image as a background). You can place any div over any other div, even if it contains a google map. Now there are api's for placing items INSIDE the map...these drawings can be just about anything, but they require a lat/long boundary because they are inside the map. There are also map controls you can place on the map....similar to a fixed div, BUT it has a certain flow inside the map, so if you have a map terrain dropdown and you click it, if that dropdown overlaps another map control, that map control will move down.