Plotly Scatter Text Special Character

📊 Plotly Python
1

I am having trouble in renewing special character (i.e. from fontawesome) in Scatter’s text. In the example below the text is showing hollow squares only.

Tree structure were font awesome is locally installed:
sample

Here is the code:

import plotly.graph_objects as go
import dash
from dash import dcc, html
import dash_bootstrap_components as dbc
import fontawesome as fa

text = fa.icons['clock']
print(text)

fa_text = html.Div(
    [
        html.P(
            'please come home',
            style={
                'color': 'green',
                'display': 'inline-block'
            }
        ),
        html.P(
            className='fa-regular fa-chart-bar fa-xl m-3',
            style={
                'color': 'green',
                'display': 'inline-block'
            }
        ),
    ]
)
fig = go.Figure()
fig.add_trace(
    go.Scatter(
        x=[0, 1, 2],
        y=[1, 1, 1],
        mode="lines+markers+text",
        name="Lines, Markers and Text",
        text=[text, 'Header-1', text],
        textposition="top center",
        textfont=dict(
            family='Font Awesome 5 Free',
            size=12,
            color='red'
        ),
    )
)

app = dash.Dash(
    __name__,
    title='Phase3-App',
)

app.layout = dbc.Container(
    [
        html.Div(
            [
                html.Hr(),
                fa_text,
                dcc.Graph(
                    id='xyz',
                    figure=fig
                ),
            ]
        ),
    ],
    fluid=True
)

if __name__ == '__main__':
    app.run_server(port=8050, debug=True)
2

Is there a python package for font awesome? That’s cool if there is but the usual way I get icons to work is by importing them as a stylesheet

app = Dash(__name__,
           external_stylesheets=[
               'https://use.fontawesome.com/releases/v5.8.1/css/all.css'
           ]
           )

and then placing an I component somewhere

html.I(className='fas fa-home fa-fw fa-lg')],
3

Yes there is fontawesome package. However, the topic point is about displaying fontawesome text in the Text Attribute of Scatter Plot

4

Hmm yea i see the same thing, I’m not sure this can be done that way but i’m still tinkering with it.
One post from a bit ago got it working using the unicode version of some icons:

https://community.plotly.com/t/i-want-to-use-custom-icon-for-the-scatter-markers-how-to-do-it/6644