写点什么

如何使用 Plotly 和 Dash 进行数据可视化

  • 2024-04-15
    广东
  • 本文字数:5572 字

    阅读完需:约 18 分钟

如何使用Plotly和Dash进行数据可视化

本文分享自华为云社区《从数据到部署使用Plotly和Dash实现数据可视化与生产环境部署》,作者: 柠檬味拥抱。


数据可视化是数据分析中至关重要的一环,它能够帮助我们更直观地理解数据并发现隐藏的模式和趋势。在 Python 中,有许多强大的工具可以用来进行数据可视化,其中 Plotly 和 Dash 是两个备受欢迎的选择。Plotly 提供了丰富多样的交互式绘图功能,而 Dash 则是一个用于构建交互式 Web 应用的 Python 框架。本文将介绍如何使用 Plotly 和 Dash 进行数据可视化,并通过案例代码展示其应用。

安装 Plotly 与 Dash


首先,我们需要安装 Plotly 和 Dash 库。你可以通过以下命令使用 pip 来安装它们:


pip install plotly dash
复制代码


安装完成后,我们就可以开始使用这两个库了。

案例代码:简单的数据可视化应用


让我们以一个简单的例子开始,假设我们有一些关于销售数据的 CSV 文件,我们想要创建一个交互式的图表来可视化这些数据,并将其部署为一个 Web 应用。首先,我们需要导入必要的库:


import dashfrom dash import dcc, htmlimport plotly.express as pximport pandas as pd
# 读取数据df = pd.read_csv('sales_data.csv')
# 创建Dash应用app = dash.Dash(__name__)
# 布局app.layout = html.Div([ html.H1("销售数据可视化"), dcc.Graph( id='sales-graph' )])
# 回调函数@app.callback( dash.dependencies.Output('sales-graph', 'figure'), [dash.dependencies.Input('sales-graph', 'value')])def update_graph(selected_year): filtered_df = df[df['Year'] == selected_year] fig = px.bar(filtered_df, x='Month', y='Sales', title=f'销售数据 - {selected_year}') return fig
# 启动应用if __name__ == '__main__': app.run_server(debug=True)
复制代码


在这个例子中,我们首先读取了名为 sales_data.csv 的 CSV 文件,然后创建了一个 Dash 应用。在应用的布局中,我们定义了一个标题和一个空的图表区域。然后,我们设置了一个回调函数,当用户选择不同的年份时,图表将会更新以显示相应年份的销售数据。最后,我们通过调用 run_server 方法来启动应用。


确保你的 sales_data.csv 文件包含了必要的数据字段(比如 Year、Month 和 Sales),这样代码才能正常运行。

案例代码:高级数据可视化与交互


在上一个案例中,我们展示了如何使用 Dash 和 Plotly 创建一个简单的数据可视化应用。现在,让我们进一步探索一些高级功能,比如添加更多交互性和定制化。


假设我们想要展示销售数据的趋势,并允许用户通过选择不同的产品类别来查看不同的趋势。我们可以通过下面的代码来实现这个功能:


import dashfrom dash import dcc, htmlimport plotly.express as pximport pandas as pd
# 读取数据df = pd.read_csv('sales_data.csv')
# 创建Dash应用app = dash.Dash(__name__)
# 布局app.layout = html.Div([ html.H1("销售数据趋势"), dcc.Dropdown( id='product-dropdown', options=[ {'label': '产品A', 'value': 'Product A'}, {'label': '产品B', 'value': 'Product B'}, {'label': '产品C', 'value': 'Product C'} ], value='Product A' ), dcc.Graph( id='sales-trend' )])
# 回调函数@app.callback( dash.dependencies.Output('sales-trend', 'figure'), [dash.dependencies.Input('product-dropdown', 'value')])def update_trend(selected_product): filtered_df = df[df['Product'] == selected_product] fig = px.line(filtered_df, x='Month', y='Sales', title=f'{selected_product}销售趋势') return fig
# 启动应用if __name__ == '__main__': app.run_server(debug=True)
复制代码


在这个例子中,我们添加了一个下拉菜单,允许用户选择不同的产品类别。当用户选择不同的产品后,图表将会更新以显示所选产品的销售趋势。这样,用户就可以更灵活地探索不同产品的销售情况。


除了简单的折线图外,Plotly 还提供了丰富的图表类型和定制选项,可以满足更多复杂的可视化需求。Dash 则允许我们构建交互式的 Web 应用,并通过回调函数实现图表的动态更新,为用户提供更好的体验。

添加交互性与样式美化


在上述案例中,我们展示了如何使用 Dash 和 Plotly 创建数据可视化应用,并提供了基本的交互功能。现在,让我们进一步添加一些交互性和样式美化,使我们的应用更加吸引人和易于使用。


import dashfrom dash import dcc, html, callback_contextimport plotly.express as pximport pandas as pd
# 读取数据df = pd.read_csv('sales_data.csv')
# 获取唯一的产品列表available_products = df['Product'].unique()
# 创建Dash应用app = dash.Dash(__name__)
# 应用样式app.layout = html.Div([ html.H1("销售数据趋势", style={'textAlign': 'center'}), html.Div([ html.Label("选择产品:"), dcc.Dropdown( id='product-dropdown', options=[{'label': product, 'value': product} for product in available_products], value=available_products[0] ) ], style={'width': '50%', 'margin': 'auto', 'textAlign': 'center'}), dcc.Graph( id='sales-trend', config={'displayModeBar': False} # 禁用图表的模式栏 )], style={'padding': '20px'})
# 回调函数@app.callback( dash.dependencies.Output('sales-trend', 'figure'), [dash.dependencies.Input('product-dropdown', 'value')])def update_trend(selected_product): filtered_df = df[df['Product'] == selected_product] fig = px.line(filtered_df, x='Month', y='Sales', title=f'{selected_product}销售趋势') return fig
# 启动应用if __name__ == '__main__': app.run_server(debug=True)
复制代码


在这个例子中,我们添加了一些样式以使应用看起来更吸引人。我们设置了标题居中显示,并在产品下拉菜单周围添加了一些空白空间以增加布局的美观性。此外,我们还禁用了图表的模式栏,以简化用户界面。


通过这些改进,我们的应用现在不仅提供了强大的交互式数据可视化功能,而且具有更好的外观和用户体验。这将使用户更愿意使用我们的应用来探索数据,并从中获得有价值的见解。

部署至生产环境


在完成数据可视化应用的开发之后,我们通常希望将应用部署到生产环境中,以便其他用户能够访问和使用。在本节中,我们将讨论如何将我们的 Dash 应用部署到生产服务器上。

使用 Gunicorn 和 Nginx


Gunicorn 是一个 Python WSGI(HTTP 服务器) HTTP 服务器,它能够处理来自 Web 应用的 HTTP 请求。Nginx 则是一个高性能的 HTTP 和反向代理服务器,通常用于处理静态文件和负载均衡。


首先,我们需要安装 Gunicorn 和 Nginx:


pip install gunicornsudo apt-get install nginx
复制代码


接下来,我们使用 Gunicorn 来运行我们的 Dash 应用:


gunicorn -w 4 -b 0.0.0.0:8050 your_app:app
复制代码


这将在本地启动 Gunicorn 服务器,并将 Dash 应用运行在 8050 端口上。接下来,我们需要配置 Nginx 来作为反向代理,将 HTTP 请求转发到 Gunicorn 服务器上。

配置 Nginx


在 Nginx 的配置文件中添加以下内容:


server {    listen 80;    server_name your_domain.com;
location / { proxy_pass http://127.0.0.1:8050; proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; }}
复制代码


将 your_domain.com 替换为你的域名。然后重新加载 Nginx 配置:


sudo systemctl reload nginx
复制代码


现在,你的 Dash 应用已经成功部署到生产环境中,并且可以通过你的域名访问了。

使用 HTTPS


为了提高安全性,我们还可以配置 Nginx 来使用 HTTPS 协议。你需要获取 SSL 证书并将其配置到 Nginx 中。一种简单的方法是使用 Let’s Encrypt 来获取免费的 SSL 证书。以下是一个简单的配置示例:


server {    listen 80;    server_name your_domain.com;
location / { return 301 https://$host$request_uri; }}
server { listen 443 ssl; server_name your_domain.com;
ssl_certificate /etc/letsencrypt/live/your_domain.com/fullchain.pem; ssl_certificate_key /etc/letsencrypt/live/your_domain.com/privkey.pem;
location / { proxy_pass http://127.0.0.1:8050; proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; }}
复制代码


这样配置后,你的 Dash 应用将通过 HTTPS 协议提供服务,并且所有的 HTTP 请求都会被重定向到 HTTPS。

集成用户认证和权限管理


在某些情况下,你可能希望限制对数据可视化应用的访问,只允许特定用户或用户组访问。为了实现这一点,我们可以集成用户认证和权限管理系统。

使用基本认证


一种简单的方法是使用基本认证(Basic Authentication)。你可以在 Nginx 中配置基本认证,要求用户在访问应用之前提供用户名和密码。以下是一个示例 Nginx 配置:


server {    listen 443 ssl;    server_name your_domain.com;
ssl_certificate /etc/letsencrypt/live/your_domain.com/fullchain.pem; ssl_certificate_key /etc/letsencrypt/live/your_domain.com/privkey.pem;
location / { auth_basic "Restricted Access"; auth_basic_user_file /etc/nginx/.htpasswd;
proxy_pass http://127.0.0.1:8050; proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; }}
复制代码


在这个配置中,我们使用 auth_basic 指令启用基本认证,并指定了一个密码文件/etc/nginx/.htpasswd。你需要使用 htpasswd 工具创建这个密码文件,并向其中添加用户名和密码。

使用 OAuth 认证


另一种常见的方法是使用 OAuth 认证。通过 OAuth,你可以将用户的认证过程委托给第三方身份提供者,如 Google、GitHub 等。一旦用户通过第三方身份提供者认证成功,他们就可以访问你的应用。


你可以使用 Dash 的 dash-auth 库来实现 OAuth 认证。该库提供了一种简单的方式来集成多种 OAuth 提供者,并限制对 Dash 应用的访问。

添加权限管理


除了认证之外,你可能还希望对用户进行授权,以确定他们是否有权访问特定的数据或功能。一种常见的方法是在应用中实现角色基础的访问控制(Role-Based Access Control,RBAC)系统。通过 RBAC,你可以将用户分配到不同的角色,并在应用中限制不同角色的访问权限。


你可以在 Dash 应用中实现 RBAC 系统,根据用户的角色来决定他们是否有权执行特定操作。这可能涉及到在用户登录时检查他们的角色,并根据角色动态地调整应用中的功能和数据访问权限。

日志记录和错误处理


在部署生产环境的应用时,日志记录和错误处理是非常重要的。良好的日志记录可以帮助你追踪应用的运行情况,并及时发现和解决问题。错误处理能够提高应用的稳定性,减少因错误而导致的服务中断。

配置日志记录


首先,让我们配置应用的日志记录。Dash 应用通常会输出日志到 stdout 或 stderr,我们可以通过重定向这些日志到一个文件来进行记录。我们还可以使用 Python 的 logging 模块来实现更高级的日志记录。


import logging
logging.basicConfig(filename='app.log', level=logging.INFO)
复制代码


在 Dash 应用中添加上述代码将会把日志记录到名为 app.log 的文件中,并设置记录级别为 INFO。你可以根据需要调整日志级别,以便记录不同程度的信息。

错误处理


另一个重要的方面是错误处理。当应用发生错误时,我们希望能够捕获并记录这些错误,同时向用户提供友好的错误信息。


在 Dash 应用中,你可以使用 try-except 块来捕获异常,并在发生异常时返回一个错误页面或显示一条友好的错误消息。


@app.server.errorhandler(Exception)def handle_error(e):    logging.error(f'An error occurred: {str(e)}')    return html.H1("Oops! Something went wrong."), 500
复制代码


在上述代码中,我们定义了一个错误处理函数 handle_error,它捕获了所有的异常。当发生异常时,它会将错误信息记录到日志中,并返回一个包含错误消息的页面给用户。


通过良好的日志记录和错误处理,我们可以更好地了解应用的运行情况,并在发生错误时采取相应的措施来保障应用的稳定性和可靠性。

监控和性能优化


最后,一旦应用部署到生产环境中,我们还需要定期监控应用的性能,并采取措施来优化性能。这包括监控应用的响应时间、内存使用情况、CPU 负载等指标,并根据监控结果进行优化。


你可以使用监控工具如 Prometheus、Grafana 等来监控应用的性能指标,并根据监控结果进行调整和优化。

总结


本文详细介绍了将 Dash 应用部署到生产环境的关键步骤和必要措施。首先,我们讨论了使用 Gunicorn 和 Nginx 来部署 Dash 应用的方法,并展示了如何通过 HTTPS 协议提高应用的安全性。接着,我们探讨了如何集成用户认证和权限管理系统,以及如何配置日志记录和错误处理,从而提高应用的稳定性和可靠性。最后,我们强调了监控和性能优化的重要性,并提出了一些监控工具和优化方法。通过这些措施,我们可以将 Dash 应用部署到生产环境中,并使其在生产环境中更加健壮和可靠,为用户提供优质的服务和体验。


点击关注,第一时间了解华为云新鲜技术~

发布于: 3 小时前阅读数: 8
用户头像

提供全面深入的云计算技术干货 2020-07-14 加入

生于云,长于云,让开发者成为决定性力量

评论

发布
暂无评论
如何使用Plotly和Dash进行数据可视化_Python_华为云开发者联盟_InfoQ写作社区