英文:
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 = {
"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()
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论