I am trying to invert the toner layer here, and maybe add a color tint to it as well as you can see here on Map Stack : http://mapstack.stamen.com/edit.html#toner[invert=1,tint=$1e88e5@100]/11/37.7547/-122.3513
Although, I'm not sure how would I use that url as a parameter since I don't see it reflect on the map instance.
The API in OpenLayers has no information on how to manipulate the Stamen map.
The Code
<TileLayer
id="nightmode"
title="Night Mode"
source={
new Stamen({
layer: 'toner',
params: {
layers: "",
format: "image/png",
tiled: true
}
})
}
/>
In OpenLayers 6 similar to the grayscale OSM in this example https://openlayers.org/en/main/examples/semi-transparent-layer.html you could specify a className for the layer and use an invert css filter https://codesandbox.io/s/gifted-newton-mk9th?file=/main.js
An alternative would be to use a globalCompositeOperation similar to https://codesandbox.io/s/globalcompositeoperation-fktwf