Google map api v3 background color

Question

I placed a custom png map on a google map. I deleted everything from Google maps to only display my custom map. The background color is blue and I want to change it to white. Here is the code:

function initialize() { var myLatLng = new google.maps.LatLng(39, -98.5); var myOptions = { maxZoom: 4, minZoom: 4, zoom: 4, panControl: false, draggable: false, center: myLatLng, disableDefaultUI: true, mapTypeId: google.maps.MapTypeId.ROADMAP, backgroundColor: '#FFFFFF' }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var mapStyles = [ { featureType: "all", stylers: [ { visibility: "off" }] }]; map.setOptions({styles: mapStyles}); } 

It only blinks white, and then turns to blue. How to set it to white or transparent?

Answer 1

although you deleted everything that was left, remained empty.

You can try to hide these fragments, CSS works for me:

  /*the desired background for the map*/ #map_canvas{background-color:#fff !important} /*hides the tiles (and maybe more^^)*/ #map_canvas div div div div div div img{visibility:hidden} 

Answer 2

You can simply set backgroundColor: 'none'

 var map = new google.maps.Map(document.getElementById('map'), { zoom: 11, center: {lat: 41.876, lng: -87.624}, backgroundColor: 'none' }); 

Answer 3

Thanks to Dr.Molle, I tried his answer and just #map> div> * {background-color: # 000} works for me. No need to use! The important thing is better for performance.