什么是 Plotly？
Plotly 是一个交互式可视化库，可用于 Python、JavaScript、R 和其他语言。它使用 D3.js 和 WebGL 在浏览器中渲染图表，即使使用大型数据集也能实现丰富的交互性。Plotly Express (Python) 提供高级 API 用于快速创建图表，而 plotly.graph_objects 提供精细控制。
- 默认可交互 - 悬停工具提示、缩放、平移、选择
- Web 原生 - 在浏览器和 Jupyter 笔记本中呈现精美
- 跨平台 - Python、JavaScript、R、Julia、MATLAB
- Dash 集成 - 使用 Plotly 图表构建完整的 Web 仪表板
- 导出选项 - 静态图像 (PNG, SVG, PDF) 或交互式 HTML
使用 Plotly Express 创建基本条形图 (Python)
Plotly Express 是在 Python 中创建 Plotly 图表的最快方法。导入并准备数据后，条形图只需一行代码。这是一个最小示例： ```python import plotly.express as px data = {'Category': ['A', 'B', 'C', 'D'], 'Values': [23, 45, 56, 78]} fig = px.bar(data, x='Category', y='Values', title='基本条形图') fig.show() ```
- px.bar() 默认创建垂直条形图
- x 和 y 定义类别列和值列
- fig.show() 渲染交互式图表
- 适用于 Jupyter 笔记本、Colab、VS Code 和脚本
- 添加 color='列名' 可按类别着色
Plotly 中的水平条形图
通过设置 orientation='h' 并交换 x 和 y 的赋值来翻转方向。水平条形图适用于较长的类别名称或当您有很多类别时。 ```python fig = px.bar(data, x='Values', y='Category', orientation='h', title='水平条形图') fig.show() ```
分组（聚类）条形图
使用 color 参数并排显示多个系列。Plotly 自动为每个类别分组条形图。 ```python import plotly.express as px df = px.data.medals_long() # 示例数据集 fig = px.bar(df, x='nation', y='count', color='medal', barmode='group', title='各国奥运奖牌') fig.show() ```
- barmode='group' 将条形图并排放置
- color 参数将数据拆分为单独的条形图系列
- 每种颜色都成为一个图例项
- 悬停显示单个条形图的详细信息
使用 Plotly 创建堆叠条形图
将 barmode 更改为 'stack' 以创建堆叠条形图。使用 color 而不指定 barmode 时的默认行为是堆叠。 ```python fig = px.bar(df, x='nation', y='count', color='medal', barmode='stack', title='堆叠奥运奖牌') fig.show() ```
自定义 Plotly 条形图
Plotly 通过 update_layout() 和 update_traces() 方法提供广泛的自定义。您可以修改颜色、字体、轴、注释等。
- fig.update_layout(title_font_size=24) - 调整标题样式
- fig.update_traces(marker_color='blue') - 更改条形颜色
- fig.update_xaxes(tickangle=45) - 旋转轴标签
- color_discrete_sequence=['#1f77b4', '#ff7f0e'] - 自定义调色板
- fig.add_annotation() - 在任何位置添加文本注释
JavaScript 中的 Plotly 条形图
barChartGuides.guides.plotly-bar-chart.content.sections.6.content
添加交互性和动画
使用 Plotly 默认启用或通过最少配置启用的动画和交互功能来增强用户体验。
- 悬停工具提示 - 默认启用，使用 hovertemplate 自定义
- 点击事件 - 在 JavaScript 中使用 plotly_click 事件执行自定义操作
- 动画 - 添加 animation_frame 参数实现动画过渡
- 范围滑块 - 添加 rangeslider 用于时间序列探索
- 按钮/下拉菜单 - 使用 updatemenus 添加 UI 控件
何时使用 Plotly 与 ChartGen.ai
对于构建交互式仪表板或数据应用程序的开发人员来说，Plotly 非常出色，因为在这些应用程序中，程序化控制至关重要。然而，对于快速可视化或当您不想编写代码时，ChartGen.ai 提供了一条通往专业图表的更快路径。
- 选择 Plotly 的场景：构建应用程序/仪表板、需要程序化更新、需要复杂的交互性
- 选择 ChartGen.ai 的场景：快速的一次性图表、偏好无编码、需要即时导出、客户演示
- ChartGen.ai 的优势：粘贴数据，几秒钟内获得图表 - 无需库设置
- Plotly 的优势：完全控制、动画、自定义点击处理程序
分步指南：如何创建Plotly 条形图：使用 Python 和 JavaScript 创建交互式条形图
安装 Plotly
Python：pip install plotly。JavaScript：通过 CDN 包含或 npm install plotly.js。
导入库
Python：import plotly.express as px。JavaScript：包含 script 标签或 import 语句。
准备数据
将数据组织为 DataFrame (Python) 或对象数组 (JavaScript)，包含类别和值列。
创建条形图
Python：fig = px.bar(df, x='category', y='value')。JavaScript：Plotly.newPlot('div', data)。
自定义外观
在 Python 中使用 update_layout()、update_traces()，或在 JavaScript 中使用 layout/config 对象。
显示或导出
fig.show() 用于交互式显示，fig.write_image() 用于静态导出，或 fig.to_html() 用于嵌入网页。