Add new className property to ol/layer/Base

examples/semi-transparent-layer.css

@@ -0,0 +1,3 @@
+.bw {
+  filter: grayscale(100%);
+}

examples/semi-transparent-layer.html

@@ -3,7 +3,7 @@ layout: example.html
 title: Semi-Transparent Layer
 shortdesc: Example of a map with a semi-transparent layer.
 docs: >
-  This example will display a tiled MaxBox layer semi-transparently over an OSM background.
+  This example will display a tiled MaxBox layer semi-transparently over an OSM background. The OSM layer is changed to back and white by using a CSS filter.
 tags: "transparent, osm, tilejson"
 ---
 <div id="map" class="map"></div>

examples/semi-transparent-layer.js

@@ -9,6 +9,7 @@ import TileJSON from '../src/ol/source/TileJSON.js';
 const map = new Map({
   layers: [
     new TileLayer({
+      className: 'bw',
       source: new OSM()
     }),
     new TileLayer({