Andre_Le
Posts: 1
Joined: Wed Oct 27, 2021 1:01 am

Adding regular FontAwesome icons as HighChart marker symbol instead of the solid verion

I found this useful fiddle about how to use FontAwesome as markers in HighChart. The idea is to use the icons' unicode to plug in HighChart.

````
marker: {
symbol: 'text:\uf0c8',

},
````
However in FontAwesome, both solid and regular versions of the same shape share the same unicode. For example, solid square and regular square. If I use their unicode, the HighChart marker is always the solid version. How do I change the marker to the regular version?
michal.f
Posts: 1114
Joined: Thu Aug 12, 2021 12:04 pm

Re: Adding regular FontAwesome icons as HighChart marker symbol instead of the solid verion

Hello,

It seems to be a bit outdated solution, in addition, it generates problems with the position of the symbol and behaviour on hover.
This is also an example based on the old version of FontAwesome, and from what I know the variant of regular icons is paid

In my opinion, the better solution in terms of optimization and less problematic is to use a custom image.

Demo: https://jsfiddle.net/gh/get/library/pur ... th-height/

Let me know if you have any further questions!
Best regards!
Michał Filipiec
Highcharts Developer
https://blacklabel.pl/highcharts/

Return to “Highcharts Usage”