如何在内置图像的打开图层中创建自定义控件？

Question

http://openlayers.org/en/latest/examples/custom-controls.html?q=custom

这是如何创建自定义控件的一个很好的例子，但我似乎无法使它与图像一起工作。

我要在定制控件包括图像是here

另外，我不希望像做任何事情，只是有在一个角落里。

Answer 1

自定义控件基本上只是具有事件处理程序的DOM元素，所以您只需创建一个元素并应用一点CSS即可。

customControl = function(opt_options) { 
    var element = document.createElement('div'); 
    element.className = 'custom-control ol-unselectable ol-control'; 
    ol.control.Control.call(this, { 
     element: element 
    }); 
    }; 
    ol.inherits(customControl, ol.control.Control); 

    var map = new ol.Map({ 
    layers: [new ol.layer.Tile({source: new ol.source.OSM()})], 
    controls: [new customControl], 
    target: 'map', 
    view: new ol.View({ 
     center: [-11000000, 4600000], 
     zoom: 4 
    }) 
    }); 

CSS：

.custom-control { 
    top: 20px; 
    right: 20px; 
    width: 70px; 
    height: 70px; 
    background: no-repeat url('http://openlayers.org/en/latest/examples/resources/logo-70x70.png') 
}