一、More about Visualization
The Dash Core Compnents module dash.dcc includes a componenet called Graph.
Graph renders interactive data visualizations using the open source plotly.js javaScript graphing library.Plotly.js supports over 35 chart types and renders charts in both vector-quality SVG and high-performance WebGL.
The figure argument in the Graph components is the same figure artument that is used by plotly.py, Plotly's open source Python graphing library.
from dash import Dash, dcc, html
import plotly.express as px
import pandas as pd
app = Dash(__name__)
df = pd.read_csv('https://raw.githubusercontent.com/GarciaShanCW/DATA/main/gdp-life-exp-2007.csv')
fig = px.scatter(df, x='gdp per capita', y='life expectancy',
size = 'population', color='continent', hover_name='country',
log_x=True, size_max=60)
app.layout = html.Div([
dcc.Graph(
id='life-exp-vs-gdp',
figure=fig
)
])
if __name__ == '__main__':
app.run(debug=True)
二、解读
from dash import Dash, dcc, html import plotly.express as px import pandas as pd
- Dash类(用于创建Dash应用程序)、dcc模块(包含Dash核心组件,如Graph等)和html模块(包含HTML元素)
- 导入Plotly Express库,这是一个用于快速创建图表的库,使用别名
px
- 导入Pandas库,这是一个数据处理和分析库,使用别名
pd
app = Dash(__name__) pf = pd.read_csv('https://raw.githubusercontent.com/GarciaShanCW/DATA/main/gdp-life-exp-2007.csv')
- 创建一个Dash应用程序实例,
__name__
是一个Python内置变量,用于获取当前模块的名称- 使用Pandas的
read_csv
函数从提供的URL读取CSV文件
fig = px.scatter(df, x='gdp per capita', y='life expectancy', size='population', color='continent', hover_name='country', log_x=True, size_max=60)
fig = px.scatter(...):
- 使用 plotly.express 的 scatter 函数创建一个散点图,其中:
- df:数据源
- x='gdp per capita' :X轴表示人均DGP
- y='life expectancy':Y轴表示预期寿命
- size='population':点的大小表示人口数量
- color='continent':点的颜色表示大陆
- hover_name='country':鼠标悬停时显示国家名称
- log_x=True:对X轴进行对数变换
- size_name=60:设置点的最大大小
app.layout = html.Div([ dcc.Graph( id='lief-exp-vs-gdp', figure=fig ) ])
- app.layout = html.Div([...]):设置Dash 应用程序的布局。
- dcc.Graph() 组件用于显示图表,id 属性用于标识组件,figure属性用于传递图表数据。
if __name__ == '__main__': app.run(debug=True)
- 这是一个Python 条件语句,用于判断当前脚本是否作为主程序运行。如果是,则执行下面的代码。
- app.run(debug=True):调用Dash应用程序的run方法来启动服务器,debug=True表示在调试模式下运行,这允许在开发过程中自动重新加载代码。