python - 破折号 : how to control graph style via CSS?

Question

我有一个简单的 Dash 应用程序，我想通过 CSS 设置绘图的字体和颜色。这是我的 app.py好像:

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objects as go

def generate_plot():
    fig = go.Figure()
    fig.add_trace(go.Scatter(x=[1, 2, 3], y=[1, 2, 3]))
    return fig

app = dash.Dash(__name__)
app.layout = html.Div(children=[
    html.H1(children="title", className="title"),
    dcc.Graph(figure=generate_plot(), class="plot")
])

我也有一个文件 assets/style.css我真的，我想用描述我的 dcc.Graph 的内容来扩展这个文件。对象应该看起来。这可能吗？如果是，那我该怎么做？我希望能够设置字体、背景颜色、线条/标记颜色等。不幸的是，类似于 .plot { background-color: aqua; }在 CSS 中没有效果。另外，html, body {font-family: serif; }也没有效果。

Answer 1

我已经通过以下方式在仅开发的基础上解决了其中一些问题:

我将 CSS 文件托管在与 dash Flask 服务器不同的网络服务器上。这对于生产架构来说似乎是合理的，但在开发环境中它很困惑，因为必须在 url 中指定 web 服务器地址才能使用与开发 Flask 服务器不同的端口(例如，:8050 默认值)。

app.css.append_css(dict(external_url='http://localhost/style.css'))

使用这个 css 文件，我可以设置 Dash 页面的一些基于样式的元素，例如

html { background-color: aqua;}

我还不能在所有自动生成的组件中找到或设置 CSS 样式，但是有一些钩子(Hook)可以直接设置许多样式元素。见 https://plotly.com/python/reference/#scatter更多。将适合我的代码拼接到您的示例中，这应该可以工作:

fig.add_trace(go.Scatter(x=[1, 2, 3], y=[1, 2, 3], textfont={'family': 'serif'}))