pythonchartsdarkmodetaipy

How to change colors from light mode to dark mode in Taipy charts?


I could not understand how to change colors automatically in a Taipy chart from light mode to dark mode. Is there a way to do it?


Solution

  • Charts have template properties in Taipy:

    You can change through these templates how graphs are viewed depending on the mode. This is what Taipy relies on to provide a light/dark mode.

    The template structure is given in the Plotly documentation.

    Suppose you want to change other aspects of the application between light/dark mode. In that case, you can modify the stylekit or directly the theme where Taipy exposes a way to change to modify visuals/colors between light and dark mode.

    Here is an example of a dark template with pink colors:

    from taipy import Gui
    
    chart_dark_template = {
        "data": {
            "scatter": [
                            {
                                "marker": {
                                    "line": {
                                        "color": "#FFC0CB"
                                    }
                                },
                                "type": "scatter"
                            }
                        ],
        },
        "layout": {
            "colorway": [
                "#FFC0CB",
                "#EF553B",
                "#00cc96",
                "#ab63fa",
                "#FFA15A",
                "#19d3f3",
                "#FF6692",
                "#B6E880",
                "#FF97FF",
                "#FECB52"
            ],
            "font": {
                "color": "#FFC0CB"
            },
            "mapbox": {
                "style": "dark"
            },
            "paper_bgcolor": "rgb(255,200,203)",
            "plot_bgcolor": "rgb(255,200,203)",
        }
    }
    
    # pink: rgb(255,200,203)
    # pink: #FFC0CB
    
    data = {
        "x": range(10),
        "y": [1,4,1,3,2,5,6,7,8,9]
    }
    
    md = "<|{data}|chart|template[dark]={chart_dark_template}|>"
    
    Gui(md).run()