Recently I stumbled upon this interesting article showing potential of adding custom styles to Google Maps. Some examples of styled maps can be seen here and you can design your own from scratch here.

I'd like to apply 'greyscale' theme to my OpenLayers base map: enter image description here

Style description according to Google demo would look somehow like:

var styles = {
  'Greyscale': [
      featureType: 'all',
      rules: [
        {saturation: -100},
        {gamma: 0.50}

My Google map in OpenLayers currently looks simply like:

var gmap = new OpenLayers.Layer.Google("Google Streets",
    'numZoomLevels': 20,
    'sphericalMercator': true}

How could I apply greyscale theme to my map?


1 Answer 1


It seems that you can directly access the googlemap object using layer.mapObject.

Refer to gmap API to style the layer: https://developers.google.com/maps/documentation/javascript/styling

Here is a small example page I have created: http://www.intermezzo-coop.eu/mapping/styled_gmap.html

See also the googlemap wizard : https://mapstyle.withgoogle.com/

  • Did you succeed, Radek?
    – simo
    Commented Mar 3, 2011 at 16:14
  • @simo: I'm not sure exactly how to use 'layer.mapObject'
    – user173
    Commented Jun 6, 2011 at 15:24
  • 1
    @radek; your going to need to create some of your own JS to define your map styling; there are several good examples on the second link there that will show you very good flow.
    – D.E.Wright
    Commented Jun 6, 2011 at 16:45
  • 1
    @radek : I haven't test it but I guess you create your gmap layer as so var glayer = new OpenLayers.Layer.Google(options), then create your style using Gmap syntax, and finally apply it doing glayer.mapObject.mapTypes.set('hiphop', jayzMapType); see the given exemple above. If I have some time soon, I'll try to do it and let you know
    – simo
    Commented Jun 6, 2011 at 20:24
  • 4
    @radek : Here we go empreinte-urbaine.eu/mapping/styled_gmap.html
    – simo
    Commented Jun 7, 2011 at 9:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.