Dash(Python) - dash-daq 仪表中的较粗环

Question

dash_daq.Gauge输出的环太细了，如下图所示

我想要更厚的戒指。我在“检查元素”下找不到 css 元素来增加环的厚度。我该怎么做？

Answer 1

gauge meter 由 svg 标签组成。为了得到一个想法，我将展示屏幕截图

尝试改变 stroke-width 属性值来改变细度。我希望这能帮助你获得初步的想法。

Answer 2

只需创建一个 assets 文件夹并将您的 css 文件放在那里，例如"styles.css" 并且运行良好 (Dash v1.6.0)

styles.css:

circle {
    stroke-width: 20px;
}

app.py:

import dash
import dash_daq as daq
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash(__name__, assets_folder = 'assets', include_assets_files = True)

app.layout = html.Div([
    daq.Gauge(
        id='my-gauge',
        label="Default",
        value=6,
        style={'display': 'block' }
    ),
    dcc.Slider(
        id='my-gauge-slider',
        min=0,
        max=10,
        step=1,
        value=5
    ),
])

@app.callback(
    dash.dependencies.Output('my-gauge', 'value'),
    [dash.dependencies.Input('my-gauge-slider', 'value')]
)
def update_output(value):
    return value

if __name__ == '__main__':
    app.run_server(debug=True)

Dash(Python) - dash-daq 仪表中的较粗环

Dash(Python) - thicker ring in gauge meter of dash-daq

css

python

python-3.x

plotly-dash

plotly-python