自定义的OpenLayers控制

我如何可以轻松地定制的OpenLayers地图控件？或者至少，我怎样才能最小化控件的高度？自定义的OpenLayers控制

谢谢。

PS。有没有CSS覆盖？

来源

2009-11-01 Tomer Lichtash

你指的是特定的控件吗？ – 2009-11-01 20:50:53

放大/缩小栏。 – 2009-11-01 22:38:05

-4

看一看 - http://geojavaflex.blogspot.com/ 我正在展示如何执行LayerSwitcher的参与定制。这可能会告诉你如何做你以后的事情。

有展示了如何控制工作，以及后续的帖子将详细讨论该代码的网页上的地图。

如果你在代码只是有兴趣看到页面的源代码，并查找链接CustomLayerSwitcher.js的切换器的定制版本。

来源

2009-11-19 03:42:06 Mike

链接现在被破坏 – 2012-03-21 14:01:30

@CaptainkurO这就是为什么答案应该包括代码不仅仅是链接... -1从我！ – Ryley 2012-03-21 21:41:23

为了减少OpenLayers.js的ZoomBar搜索zoomStopHeight，并根据需要进行编辑。

另外参考：Link。

来源

2009-11-01 23:19:03

有自带的可以控制所有的CSS的OpenLayers内的命令通常.olZoombar {}这里这可能是编辑这些各种各样的东西，否则你可以编辑实际js文件的最简单的方法一个CSS文件为控制。

来源

2010-02-24 02:30:02 Sphvn

如上所述，如果您正在讨论PanZoomBar或ZoomBar，则需要编辑zoomStopHeight。但是，你并不需要编辑OpenLayers.js。

new OpenLayers.Control.PanZoomBar({zoomStopHeight: 7})

你可以考虑尝试PanZoom，它没有酒吧。

来源

2010-04-04 05:32:24

您可以对任何openLayers控件进行子类化。我只是做了“缩放滑块”的子类PanZoomBar（panZoomBar.js），覆盖了draw（）方法和注释掉所有按钮元素，只留下缩放滑块..这样的：

function zoomSlider(options) { 

    this.control = new OpenLayers.Control.PanZoomBar(options); 

    OpenLayers.Util.extend(this.control,{ 
     draw: function(px) { 
      // initialize our internal div 
      OpenLayers.Control.prototype.draw.apply(this, arguments); 
      px = this.position.clone(); 

      // place the controls 
      this.buttons = []; 

      var sz = new OpenLayers.Size(18,18); 
      var centered = new OpenLayers.Pixel(px.x+sz.w/2, px.y); 

      this._addButton("zoomin", "zoom-plus-mini.png", centered.add(0, 5), sz); 
      centered = this._addZoomBar(centered.add(0, sz.h + 5)); 
      this._addButton("zoomout", "zoom-minus-mini.png", centered, sz); 
      return this.div; 
     } 
    }); 
    return this.control; 
} 

var panel = new OpenLayers.Control.Panel(); 
panel.addControls([ 
    new zoomSlider({zoomStopHeight:11}), 
    new OpenLayers.Control.LayerSwitcher({'ascending':false}), 
]); 
map.addControl(panel);

来源

2010-05-11 15:20:52 zack

自定义的OpenLayers控制

回答

相关问题