如何在Taipy图表中从浅色模式切换到深色模式?

huangapple go评论150阅读模式
英文:

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

问题

我不知道如何在 Taipy 图表中从浅色模式自动更改颜色为深色模式。有没有办法做到这一点?

英文:

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?

答案1

得分: 1

Charts 在 Taipy 中具有模板属性:

  • 模板
  • 模板[亮]
  • 模板[暗]

您可以通过这些模板根据模式更改图表的显示方式。这是 Taipy 依赖的方式,以提供亮色/暗色模式。

模板结构在Plotly文档中提供。

假设您想在亮色/暗色模式之间更改应用程序的其他方面。在这种情况下,您可以修改stylekit或直接修改 Taipy 公开的主题,以在亮色和暗色模式之间进行可视化/颜色修改

以下是一个具有粉色颜色的暗色模板示例:

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)",
    }
}

# 粉色: rgb(255,200,203)
# 粉色: #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()
英文:

Charts have template properties in Taipy:

  • template
  • template[light]
  • template[dark]

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 = {
    &quot;data&quot;: {
        &quot;scatter&quot;: [
                        {
                            &quot;marker&quot;: {
                                &quot;line&quot;: {
                                    &quot;color&quot;: &quot;#FFC0CB&quot;
                                }
                            },
                            &quot;type&quot;: &quot;scatter&quot;
                        }
                    ],
    },
    &quot;layout&quot;: {
        &quot;colorway&quot;: [
            &quot;#FFC0CB&quot;,
            &quot;#EF553B&quot;,
            &quot;#00cc96&quot;,
            &quot;#ab63fa&quot;,
            &quot;#FFA15A&quot;,
            &quot;#19d3f3&quot;,
            &quot;#FF6692&quot;,
            &quot;#B6E880&quot;,
            &quot;#FF97FF&quot;,
            &quot;#FECB52&quot;
        ],
        &quot;font&quot;: {
            &quot;color&quot;: &quot;#FFC0CB&quot;
        },
        &quot;mapbox&quot;: {
            &quot;style&quot;: &quot;dark&quot;
        },
        &quot;paper_bgcolor&quot;: &quot;rgb(255,200,203)&quot;,
        &quot;plot_bgcolor&quot;: &quot;rgb(255,200,203)&quot;,
    }
}

# pink: rgb(255,200,203)
# pink: #FFC0CB

data = {
    &quot;x&quot;: range(10),
    &quot;y&quot;: [1,4,1,3,2,5,6,7,8,9]
}

md = &quot;&lt;|{data}|chart|template[dark]={chart_dark_template}|&gt;&quot;

Gui(md).run()

huangapple
  • 本文由 发表于 2023年7月17日 15:53:23
  • 转载请务必保留本文链接:https://go.coder-hub.com/76702451.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定