Skip to content

Make it possible to use an alpha channel with Hex colors #7389

Open
@12rambau

Description

@12rambau

I'm using dash to create company compliant graphs so I'm using a custom ste of colors that are provided by the communication team in a company mini-package. I get them as hex colors.

I would like to create a "in between" and thus change the alpha channel of my color to make half transparent.

As in this plotting:

import plotly.graph_objects as go
from matplotlib.colors import to_rgb

color = "#4E9D2D"

fig = go.Figure()
fig.add_trace(go.Scatter(x=[1, 2, 3, 4], y=[3, 4, 8, 3],
    fill=None,
    mode='lines',
    line = {"width": 0},
    ))
fig.add_trace(go.Scatter(
    x=[1, 2, 3, 4],
    y=[1, 6, 2, 6],
    fill='tonexty',
    mode='lines',
    line = {"width": 0},
    fillcolor=f"rgba({','.join([str(int(c*255)) for c in to_rgb(color)])}, .1)"
))

fig.show()

Image

Currently color specifier are supporting:

  • A hex string (e.g. '#ff0000')
  • An rgb/rgba string (e.g. 'rgb(255,0,0)')
  • An hsl/hsla string (e.g. 'hsl(0,100%,50%)')
  • An hsv/hsva string (e.g. 'hsv(0,100%,100%)')
  • A named CSS color

In my use case that forces me to use this horrible line to create the half transparent color in rgba:

f"rgba({','.join([str(int(c*255)) for c in to_rgb(color)])}, .1)"

I cannot rely on the to_rgba function becasue you expect the 3 first digit to be int between 0 and 255 and the alpha channel as float when the matplotlib standard is giving me everything as a float.

What I would love to do is being allowed to add 2 extra digit to my hex chain to provide the alpha channel as :

color = f"{color}1a"

It's compatible with the other plotting tools I'm using (bokeh and matplotlib) but not with yours could you add the support for it ?

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2considered for next cyclecscustomer successfeaturesomething new

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions