Remove google maps background-color

background-color, google-maps, google-maps-api-3, jquery

Solution

There is a map option to change the background color: `backgroundColor`

For example:

var mapOptions = {
    zoom: 4,
    center: myLatLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    backgroundColor: "black"
};

Problem

I am trying to make my google maps transparent. I have managed to changed the opacity of the map tiles (markers are also transparent but I need to sort that out later).I wanted to add a gradient to the that would look like folds in the page and then have the transparent maps overlaying it so it looks fold lines in a map. I noticed that google is adding a background color to the div containing the maps... a slight obstical in my plan. I tried targeting the div with jquery to set the background to none. Unfortunatly for me Google won and I couldn't change it. ``` $('div div#example').css("background-color","#000"); ``` Here is a fiddle showing how I have things set up http://jsfiddle.net/pTuQ4/

Original source