Bordered Polyline

[karussell]

Is it possible to give a polyline a different color for the border of it?

[ahocevar]

Yes! Just create two styles: a thicker one for the border, and on top a thinner one for the stroke.

[karussell]

Nice idea, thanks! Is there an efficient way where I could "duplicate the style" somehow or do I have to create two features?

I currently have:

const borderFeature = new Feature(lineString)
const layer = new VectorLayer({
    source: new VectorSource({
        features: [borderFeature, new Feature(lineString)],
    }),
    style: f => f == borderFeature ? borderStyle : style
})

[ahocevar]

No need to create another feature. Just return an array of styles instead of a single style from your style function, or configure the layer's style with a static array of two styles.

Change your code to the following, and you're all set:

const layer = new VectorLayer({
    source: new VectorSource({
        features: [new Feature(lineString)],
    }),
    style: [borderStyle, style]
})

[karussell]

Ah, nice! Thanks a lot!