OpenLayers 5: stroke width scaling?

Question

Is it possible to make Stroke width dependent on the zoom level?

Basically, I am going to use LineStrings/MultiLineStrings to highlight some roads but I would also like to be able to zoom out and not have massive clutter (there will be about 8 pretty wide lines along each path).

Answer 1

You can use the resolution which is passed to a style function. I've use this code to display contours, setting lines at multiples of 50m wider, and when the resolution is greater than 2.5 both widths are reduced proportionately.

style: function(feature, resolution) {
    return new ol.style.Style({
        stroke: new ol.style.Stroke({
            color: 'rgba(224,148,94,1)',
            width: (feature.getProperties().value % 50 == 0 ? 3.175 : 1.863) * Math.min(1, 2.5/resolution)
        })
    });
}