OpenStreetMap Forum

Iconmania

Member

Registered: 2019-12-03

Posts: 33

How to change color of marker icon shape to gradient?

I'm trying to use gradient for iconShape property. Now it has this color #4d8de8.

How to change it to gradient?

case "one":
            return L.BeautifyIcon.icon({
              icon: "leaf fa-lg",
              iconShape: "marker",
              borderWidth: "1.3",
              borderColor: "#4d8de8",
              textColor: "#3A5F0B",
              backgroundColor: "transparent"
            });
            break;

Viajero Perdido

Member

Registered: 2016-10-13

Posts: 194

Re: How to change color of marker icon shape to gradient?

For best odds of a useful answer, please explain in a broader sense what you're trying to do.  Specifically, what app, programming language, etc. are you using?  We can only guess.

Iconmania

Member

Registered: 2019-12-03

Posts: 33

Re: How to change color of marker icon shape to gradient?

Hi,
so I have this regular marker on a map. It's unicoloured like this one

https://icons-for-free.com/map+marker+i … 858325800/

Instead of one color (borderColor property in my code) I'd like to use a gradient.

I'm using Java Script and Json. And of course HTML and CSS.

Last edited by Iconmania (2020-07-10 22:08:37)

Iconmania

Member

Registered: 2019-12-03

Posts: 33

Re: How to change color of marker icon shape to gradient?

Update:

why this line of code

backgroundColor: "-webkit-linear-gradient(#9c47fc, #356ad2)",

added to the code above isn't working? Isn't even seen in devtools?

SomeoneElse

Member

Registered: 2010-10-13

Posts: 1,601

Re: How to change color of marker icon shape to gradient?

Please, Iconmania, try and answer this question:

For best odds of a useful answer, please explain in a broader sense what you're trying to do.  Specifically, what app, programming language, etc. are you using?  We can only guess.

Until you do, we have no idea of what you're trying to do other than that it's something to do with OpenStreetMap data.  Currently we don't know if you're trying to process openstreetmap data for use on a web site, a phone application, a billboard or trying to engrave it in your lawn with weedkiller.