'Apply a Gradient to an Icon in Open Layers
On my project, I originally used CircleStyle to create points on a map and then used fill: new Fill({ with CanvasGradient to style the point with two colours.
I now want to use a custom icon (for example 'icon.png') instead of just a coloured dot for these points.
I have tried using image: new Icon for this which works for displaying the icon but I cannot apply a CanvasGradient to this.
I can apply a single colour to the icon with color which overlays the icon with that colour with transparency, ideally I would want this with 2 colours; half the icon being one colour and half the icon being the other colour.
I have uploaded an image showing how my points currently looked below. circleStyle point with 2 colours applied using ColourGradient
The documentation suggests that CanvasGradient cannot be applied to icons so my question is: How can I apply two colours/a gradient to an icon in OpenLayers?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|