Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

Recently I stumbled upon 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 Open layers 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?

share|improve this question
    
Google Maps Colorizr googlemapscolorizr.stadtwerk.org can be helpful if you want to define your own specific colours. –  radek May 24 '11 at 14:16
    
    
Some examples of playing with colours: 41latitude.com/post/1268734799/google-styled-maps –  radek Jun 7 '11 at 12:54
    
Don't want to let go of the bounty? :) I think simo got it –  Ragi Yaser Burhum Jun 10 '11 at 22:21
    
Indeed. Still three days of competition tho ;] –  radek Jun 11 '11 at 13:17

1 Answer 1

up vote 21 down vote accepted

It seems that you can directly access the googlemap object using layer.mapObject (source: http://openlayers.org/blog/2010/07/10/google-maps-v3-for-openlayers/#comment-34465).

Refer to gmap API to style the layer: http://code.google.com/intl/fr/apis/maps/documentation/javascript/maptypes.html#StyledMaps

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

share|improve this answer
    
Thanks simo. Will have a look on that. –  radek Feb 9 '11 at 17:50
    
Did you succeed, Radek? –  simo Mar 3 '11 at 16:14
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 Jun 6 '11 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 Jun 6 '11 at 20:24
3  
@radek : Here we go empreinte-urbaine.eu/mapping/styled_gmap.html –  simo Jun 7 '11 at 9:01

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.