[email protected]
Posts: 70
Joined: Fri Aug 26, 2022 9:33 am

How to make shadow by bar with specific color

Hello,
It's possible to have a shadow by bar and with specific color? For example: #FF0000.

Thanks in advance, Paulo Torres
User avatar
dawid.d
Site Moderator
Posts: 949
Joined: Thu Oct 06, 2022 11:31 am

Re: How to make shadow by bar with specific color

Hi,

Thanks for the question!

Yes, it's possible. You can do it using the shadow option: https://jsfiddle.net/BlackLabel/xrqchzey/

Or just use the CSS: https://jsfiddle.net/BlackLabel/cpanxy7k/

I hope it was helpful for you!
Best regards
Dawid Draguła
Highcharts Developer
[email protected]
Posts: 70
Joined: Fri Aug 26, 2022 9:33 am

Re: How to make shadow by bar with specific color

dawid.d wrote: Fri Apr 19, 2024 11:03 pm Hi,

Thanks for the question!

Yes, it's possible. You can do it using the shadow option: https://jsfiddle.net/BlackLabel/xrqchzey/

Or just use the CSS: https://jsfiddle.net/BlackLabel/cpanxy7k/

I hope it was helpful for you!
Best regards
Hello dawid,
First of all, thanks for your answer.

I would like to have a possibility to add a shadow just in some bars, for example just in the first one. Your example add the shadow in all bars. I tried to put the shadow structure inside the DATA structure but doesn't work.
It is possible to do what I need?

Thanks, Paulo Torres
User avatar
dawid.d
Site Moderator
Posts: 949
Joined: Thu Oct 06, 2022 11:31 am

Re: How to make shadow by bar with specific color

Hi again,

You can set a specific class name for a given series and use css selectors.
Demo: https://jsfiddle.net/BlackLabel/78Lh259t/

Or just add a class to the point's graphics element in the load event.
Demo: https://jsfiddle.net/BlackLabel/t1yL93jh/

Best regards!
Dawid Draguła
Highcharts Developer
[email protected]
Posts: 70
Joined: Fri Aug 26, 2022 9:33 am

Re: How to make shadow by bar with specific color

Hello dawid,
In dynamic way it seems the second option you sent it's the only possibility, right?
The chart you sent is not the Gantt, the implementation is the same?

Thanks, Paulo Torres
User avatar
dawid.d
Site Moderator
Posts: 949
Joined: Thu Oct 06, 2022 11:31 am

Re: How to make shadow by bar with specific color

Yes, it should be the same: https://jsfiddle.net/BlackLabel/d82rweh7/
Dawid Draguła
Highcharts Developer
[email protected]
Posts: 70
Joined: Fri Aug 26, 2022 9:33 am

Re: How to make shadow by bar with specific color

dawid.d wrote: Mon Apr 22, 2024 1:19 pm Yes, it should be the same: https://jsfiddle.net/BlackLabel/d82rweh7/
It's possible to set the class if in my structure of data I have certain value, let's imagine I have a boolean field 'IsShadow' and looking for this field if it's true I assign the class. It's possible? Can you help me on JS with this?

Thanks, Paulo Torres
User avatar
dawid.d
Site Moderator
Posts: 949
Joined: Thu Oct 06, 2022 11:31 am

Re: How to make shadow by bar with specific color

Hi,

I did a little research and saw that it is still possible to use the `className` option for individual points, even though the API docs itself does not mention it. Maybe this meets your expectations?

Demo: https://jsfiddle.net/BlackLabel/1rz53xsL/

Best regards!
Dawid Draguła
Highcharts Developer
[email protected]
Posts: 70
Joined: Fri Aug 26, 2022 9:33 am

Re: How to make shadow by bar with specific color

Hi dawid,
Thanks a lot for your help!
This solution works as I need, only one thing I want to ask you. Would be possible to not add this shadow in the bars from the navigator?

Check here what I'm speaking about: https://ibb.co/GWHrWtB

Thanks again, Paulo Torres
User avatar
dawid.d
Site Moderator
Posts: 949
Joined: Thu Oct 06, 2022 11:31 am

Re: How to make shadow by bar with specific color

Hi again,

If you set a series class name, you can set styles only for their children: https://jsfiddle.net/BlackLabel/9nogbv3L/

Hope it helps
Dawid Draguła
Highcharts Developer

Return to “Highcharts Gantt”