在OpenLayers2中应用自定义Google地图样式?


10

最近,我偶然发现了这篇有趣的文章,展示了向Google Maps 添加自定义样式的潜力。在这里可以看到一些样式化地图的示例,您可以在此处从头开始设计自己的样式。

我想将“灰度”主题应用于我的OpenLayers基本地图: 在此处输入图片说明

根据Google 演示的样式说明如下所示:

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

目前,我在OpenLayers中的Google地图看起来就像:

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

如何将灰度主题应用于地图?


如果您想定义自己的特定颜色,则Google Maps Colorizr googlemapscolorizr.stadtwerk.org可能会有所帮助。
radek 2011年



不想放弃赏金吗?:)我认为simo做到了
Ragi Yaser Burhum 2011年

确实。仍然有3天的比赛时间;]
radek 2011年

Answers:


20

看来您可以使用layer.mapObject直接访问googlemap对象。

请参考gmap API对图层进行样式设置:https : //developers.google.com/maps/documentation/javascript/styleling

这是我创建的一个小示例页面:http : //www.intermezzo-coop.eu/mapping/styled_gmap.html

另请参见googlemap向导:https : //mapstyle.withgoogle.com/


你成功了吗,拉德克?
simo

@simo:我不确定确切如何使用“ layer.mapObject”
radek 2011年

1
@radek; 您将需要创建一些自己的JS来定义地图样式;在第二个链接上有几个很好的例子,它们将向您展示非常好的流程。
DEWright 2011年

1
@radek:我还没有测试,但我猜你创建你GMAP层为使VAR glayer =新OpenLayers.Layer.Google(选项),然后使用GMAP语法创建自己的风格,并最终应用它做glayer.mapObject.mapTypes .set('hiphop',jayzMapType); 请参阅上面的给定示例。如果我很快有时间,我会尽力做到这一点,并让您知道
simo

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.