标签: plotly-dash

对于 R Shiny，有多个非常有用的模板可以开始构建您的仪表板。最著名的是Shinydashboard 包，它使用了 Bootstrap 3 模板。我正在寻找类似的模板或示例作为创建 Dash Dashboard 的起点。Dash 网页上有很多示例，但没有一个在左侧窗格中提供导航。

题：

是否有 Python Dash 仪表板的模板，它在网页的左窗格中有导航，在网页的右窗格中有图/过滤器？

我正在尝试使用 Heroku 提供 Dash 应用程序。我的应用中有 5 个文件：

.gitignore

venv
*.pyc
.DS_Store
.env

应用程序

import os

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go
import pandas as pd

# Read in the data
districts_change = pd.read_csv("https://github.com/thedatasleuth/New-York-Congressional-Districts/blob/master/districts_change.csv?raw=True")

df = districts_change.drop(['TOTAL'], axis=1)

# Get a list of all the districts
districts = districts_change['DISTRICT'].unique()

# Create the app
app = dash.Dash()

# Populate the layout with HTML and graph components
app.layout = html.Div([
    html.H2("New York Congressional Districts"),
    html.Div( …

背景

• 具有相同高度 (?) 的不同子图 (?)

我可以创建一个带有共享 X 轴的子图的图形（示例改编自Plot.ly doc），子图之间有适当的分隔，并且您可以通过subplot_titles以下方式为每个子图插入特定标题：

from plotly import tools
import plotly.plotly as py
import plotly.graph_objs as go

trace1 = go.Scatter(
    x=[0, 1, 2],
    y=[10, 11, 12]
)
trace2 = go.Scatter(
    x=[2, 3, 4],
    y=[100, 110, 120],
)
trace3 = go.Scatter(
    x=[3, 4, 5],
    y=[1000, 1100, 1200],
)
fig = tools.make_subplots(rows=3, cols=1, specs=[[{}], [{}], [{}]],
                          shared_xaxes=True, shared_yaxes=True,
                          vertical_spacing=0.1, subplot_titles=('subtitle 1', 
                          'subtitle 2', 'subtitle 3'))
fig.append_trace(trace1, 3, 1)
fig.append_trace(trace2, 2, 1)
fig.append_trace(trace3, …

我正在使用 Flask 和 Dash 构建一个网络应用程序。Flask 主应用程序处理用户登录和身份验证，并保护 Dash 应用程序的路由。Dash 应用程序是从 Flask 应用程序中提供的。

主要的 Flask 应用程序是使用 Flask Mega Tutorial 示例 ( https://github.com/miguelgrinberg/microblog )构建的，使用应用程序工厂模式。除了登录/身份验证之外，我删除了所有内容，并且该应用程序在该阶段运行良好。

然后，我按照此处的示例在 Flask 应用程序中添加了一个简单的 Dash 应用程序：https : //github.com/okomarov/dash_on_flask。Dash 应用程序可以在 /dashboard 上访问，仪表板受到适当保护，防止未经授权的访问，并按预期重定向回 Flask 主登录页面。

我现在面临的挑战是从 Dash 应用程序中访问 Flask 应用程序的上下文和其他内容，例如数据库会话。这样 Dash 应用程序就可以访问和显示主数据库中的信息。

我目前正在尝试遵循我在网上找到的示例，以及如何使它们适应我的应用程序的特定模式。

我尝试遵循此处链接的示例：https : //github.com/plotly/dash/issues/214#issuecomment-391223557。

但是，这些示例似乎都基于平面应用程序结构，其中 Flask 和 Dash 应用程序创建在同一个文件中。

我所有的代码都在这里：https : //github.com/danielcopelin/dacy-budget

目前，我的主要 Flask 应用程序如下所示：

dacybudget.py

from app import create_app, db
from app.models import User

app = create_app()


@app.shell_context_processor
def make_shell_context():
    return {'db': db, 'User': …

我想在 Dash 中显示 Font Awesome Icons，但它似乎不起作用。

我添加了字体很棒的样式表：

external_stylesheets = ['https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css']
app = dash.Dash('SimpleDashboard',external_stylesheets=[dbc.themes.BOOTSTRAP, external_stylesheets])

并将其添加到我的页面：

html.Div([
           html.I(className="fa fa-shield"),
    ])

但它什么也没显示。我错过了什么？

我想在 Dash by Plotly 中并排绘制两个图表（而不是一个在另一个上方）。教程没有并排绘制图形的示例。

我正在app.layout用以下方式编写

app.layout = html.Div(className = 'row', children=

    [
        html.H1("Tips database analysis (First dashboard)"),
        dcc.Dropdown(id='d',
                     options = col_options,
                    value = 'Sun'),
        dcc.Graph(id="graph1"),
        dcc.Graph(id="graph2")
    ]

)

但在这之后graph1出现在上面graph2而不是并排

我想用破折号制作一个交互式地图。所以我添加了一个 Scattermapbox 来可视化一些数据。为了选择显示哪些数据，我添加了一个滑块。并使用回调重绘地图。

import dash
import dash_html_components as html
import dash_core_components as dcc
from dash.dependencies import Input, Output
import pandas as pd
import plotly.graph_objects as go

df = pd.DataFrame({'place_no': [1, 1, 1, 2, 2, 2],
                   'lat': [50.941357, 50.941357, 50.941357, 50.932171, 50.932171, 50.932171],
                   'lon': [6.957768, 6.957768, 6.957768, 6.964412, 6.964412, 6.964412],
                   'year': [2017, 2018, 2019, 2017, 2018, 2019],
                   'value': [20, 40, 60, 80, 60, 40]})


def get_map(df_map):
    fig = go.Figure(go.Scattermapbox(
        lat=df_map['lat'],
        lon=df_map['lon'],
        mode='markers',
        marker=go.scattermapbox.Marker(
            size=df_map['value']
        ),
    ))
    fig.update_layout(
        mapbox_style="open-street-map",
        mapbox={'center': go.layout.mapbox.Center(lat=50.936600, lon=6.961497), …

我想在 Plotly 中为折线图创建一个垂直滚动。为了可视化，垂直滚动如下图所示。

假设我们有如下6个折线图，那么我们如何在画布上创建一个垂直滚动条

import plotly.graph_objects as go
import plotly.io as pio
from plotly.subplots import make_subplots
import pandas as pd

# data
pio.templates.default = "plotly_white"
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv')
df = df.set_index('Date')
df.tail()
cols = df.columns[:-4]
ncols = len(cols)

# subplot setup
fig = make_subplots(rows=ncols, cols=1, shared_xaxes=True)

for i, col in enumerate(cols, start=1):
    fig.add_trace(go.Scatter(x=df[col].index, y=df[col].values), row=i, col=1)

fig.show()

感谢您提供任何提示或好的阅读材料。

我正在尝试将下拉菜单添加到绘图线图中，该图在选择时更新图形数据源。我的数据有 3 列，如下所示：

1               Country  Average House Price (£)       Date
0  Northern Ireland                      47101.0 1992-04-01
1  Northern Ireland                      49911.0 1992-07-01
2  Northern Ireland                      50174.0 1992-10-01
3  Northern Ireland                      46664.0 1993-01-01
4  Northern Ireland                      48247.0 1993-04-01

Country 列包含英国的 4 个国家/地区，用于使用color参数为每个国家/地区创建单独的行。我有 4 个不同的数据框用于不同的住房类型，例如all_dwellings,first_timebuyers并且在尝试指定updatemenusargs 时，似乎我无法使用数据框格式。这是创建整个图形的代码。

lineplt = px.line(data_frame = all_dwellings,
              x='Date',
              y='Average House Price (£)',
              color= 'Country',
              hover_name='Country',
              color_discrete_sequence=['rgb(23, 153, 59)','rgb(214, 163, 21)','rgb(40, 48, 165)', 'rgb(210, 0, 38)']
              )
updatemenus = [
{'buttons': [
            { …

我对 Dash Plotly 很陌生，我正在尝试弄清楚如何设计这样的布局。

布局：

据我了解，使用 dash bootstrap 组件可以更轻松地完成此操作。 https://dash-bootstrap-components.opensource.faculty.ai 作为第一步，我应该重现布局（灰色瓷砖），作为第二步，我应该添加一些文本和一些图形。只是基本的。

谢谢你。