资讯动态

Pyecharts数据可视化实战:从安装配置到Web集成

发布时间:2026/10/17 1:01:47 来源:尧图企业网站定制
1. 为什么数据可视化绕不开Pyecharts这个选项做Web开发或者数据分析的朋友大概率都经历过这样一个阶段手里攒了一堆数据Excel表格拉得飞起但一到要往网页上放图表的时候就开始头疼。用Matplotlib吧生成的图片是静态的交互性几乎为零用ECharts吧JavaScript那一套配置项写起来又觉得不够顺手尤其是当你整个项目都是Python技术栈的时候前后端语言来回切换实在影响效率。Pyecharts就是在这个夹缝里长出来的一个东西。它的本质是一个Python库作用是把Python代码翻译成ECharts能识别的配置项最终渲染出可以在浏览器里交互的图表。你可以把它理解成一个“翻译官”——你写Python它帮你生成HTML和JavaScript浏览器打开就能看到折线图、柱状图、饼图、地图这些常见的可视化效果。我第一次接触Pyecharts是在一个后台管理系统的项目里当时需要把数据库里的销售数据按区域、按时间维度展示出来而且要求鼠标悬停能看到具体数值、图例可以点击筛选。如果用传统的前端方案我得让前端同事写一堆ECharts配置沟通成本高不说改个字段还得来回对接。后来换成Pyecharts后端直接出图前端只需要一个iframe或者div容器就能嵌入整个流程顺畅了很多。这篇文章适合哪些人看如果你是有一定Python基础、想快速在Web项目里集成图表的开发者或者你是数据分析师、想把分析结果以更直观的方式呈现出来再或者你只是单纯想了解一下Pyecharts到底能做什么、怎么上手那这篇内容应该能帮到你。我会从最基础的概念讲起然后逐步深入到实际案例中间穿插一些我踩过的坑和总结出来的经验。2. Pyecharts的版本选择与安装环节的取舍2.1 版本差异v0.5和v1.x完全是两个东西Pyecharts的版本问题是一个老生常谈但又不得不提的坑。如果你在网上搜教程可能会看到两种截然不同的写法一种是from pyecharts import Bar另一种是from pyecharts.charts import Bar。前者是v0.5.x版本的写法后者是v1.x版本的写法。这两个版本之间的API差异非常大几乎可以说是两个不同的库。v0.5.x是早期版本配置项比较零散很多参数直接写在图表对象的初始化方法里。v1.x之后做了大规模重构引入了options模块把配置项做了更清晰的分类比如TitleOpts、LegendOpts、TooltipOpts等等。同时v1.x对链式调用支持得更好代码写起来更流畅。我个人的建议是直接用v1.x以上的版本。原因很简单v0.5.x已经停止维护了而且v1.x的文档和社区资源更丰富遇到问题更容易找到解决方案。目前比较稳定的版本是1.9.x系列安装的时候直接指定版本号就行。2.2 安装命令与依赖说明安装Pyecharts本身很简单一条pip命令就能搞定pip install pyecharts1.9.1但这里有个细节需要注意Pyecharts生成的图表最终是HTML文件如果你只是想在Jupyter Notebook里快速预览那装完Pyecharts就够了。但如果你要把图表嵌入到Web框架比如Flask、Django里或者需要生成独立的HTML文件那可能还需要额外的依赖。比如你要用Snapshot功能把图表保存成图片就需要安装snapshot-selenium或者snapshot-phantomjs。再比如你要用地图图表就需要额外安装对应的地图包因为从v1.0开始地图数据被拆分成独立的包了pip install echarts-countries-pypkg pip install echarts-china-provinces-pypkg pip install echarts-china-cities-pypkg注意地图包的安装顺序没有强制要求但建议一次性装齐避免用到的时候才发现缺包。另外如果你用的是虚拟环境记得在对应的环境里安装别装到全局去了。2.3 验证安装是否成功装完之后怎么确认没问题最简单的办法是跑一段最小化的代码from pyecharts.charts import Bar from pyecharts import options as opts bar Bar() bar.add_xaxis([A, B, C]) bar.add_yaxis(测试, [1, 2, 3]) bar.set_global_opts(title_optsopts.TitleOpts(title测试图表)) bar.render(test.html)运行之后如果当前目录下生成了一个test.html文件用浏览器打开能看到柱状图那就说明环境没问题。如果报错说找不到某个模块大概率是版本不匹配或者依赖没装全根据报错信息补装就行。3. 图表配置项的组织逻辑与常用参数拆解3.1 全局配置项和系列配置项的区别Pyecharts的配置项分为两大类全局配置项set_global_opts和系列配置项set_series_opts。这两个概念刚开始容易搞混我用一个比喻来解释全局配置项就像是图表的“整体装修”管的是标题、图例、工具箱、坐标轴这些跟整个图表相关的元素系列配置项则是“局部装饰”管的是某一条数据系列的样式比如线条颜色、数据标签、标记点这些。全局配置项通过set_global_opts方法设置常用的有title_opts标题配置包括主标题、副标题、位置等legend_opts图例配置控制图例的显示位置、排列方向tooltip_opts提示框配置鼠标悬停时显示的内容格式xaxis_opts和yaxis_opts坐标轴配置包括轴名称、刻度范围、标签旋转角度toolbox_opts工具箱配置可以添加下载图片、数据视图等功能visualmap_opts视觉映射配置用于热力图、地图等需要颜色梯度的场景系列配置项通过set_series_opts方法设置常用的有label_opts数据标签配置控制是否显示数值、数值的位置和格式markpoint_opts标记点配置可以在最大值、最小值处添加标记markline_opts标记线配置可以添加平均线、趋势线itemstyle_opts图元样式配置控制柱子的颜色、圆角等3.2 链式调用的写法与注意事项Pyecharts v1.x支持链式调用也就是说你可以把多个配置方法串在一起写。这种写法看起来比较优雅但有几个地方需要注意。先看一个标准的链式调用示例from pyecharts.charts import Bar from pyecharts import options as opts bar ( Bar() .add_xaxis([一月, 二月, 三月, 四月]) .add_yaxis(销售额, [120, 200, 150, 80]) .add_yaxis(利润, [60, 100, 75, 40]) .set_global_opts( title_optsopts.TitleOpts(title季度销售概览), tooltip_optsopts.TooltipOpts(triggeraxis), legend_optsopts.LegendOpts(pos_top5%) ) .set_series_opts( label_optsopts.LabelOpts(is_showTrue, positiontop) ) ) bar.render(sales.html)这段代码的逻辑很清晰先创建Bar对象然后添加X轴数据再添加两个Y轴系列接着设置全局配置最后设置系列配置。链式调用的好处是一气呵成不用反复写bar.set_xxx。但要注意的是链式调用的顺序不能乱。add_xaxis和add_yaxis必须在set_global_opts之前调用因为配置项需要知道有哪些数据系列才能正确渲染图例。另外如果你需要多次调用add_yaxis添加多个系列每次调用都会返回图表对象本身所以可以一直链下去。还有一个容易忽略的点set_global_opts和set_series_opts可以多次调用后面的调用会覆盖前面的同名配置。这个特性有时候很有用比如你想先设置一个通用的标题然后在特定条件下再修改标题内容。3.3 常用配置项的参数速查为了让大家少翻文档我把最常用的几个配置项的参数整理成了一个表格配置项所属类别常用参数作用说明TitleOpts全局title, subtitle, pos_left, pos_top设置主副标题及位置LegendOpts全局is_show, pos_left, pos_top, orient控制图例显示与布局TooltipOpts全局trigger, formatter, axis_pointer_type设置悬停提示框行为AxisOpts全局name, type_, min_, max_, interval配置坐标轴名称与刻度LabelOpts系列is_show, position, font_size, color控制数据标签显示MarkPointOpts系列data, symbol, symbol_size添加最大值最小值标记MarkLineOpts系列data, linestyle_opts添加平均线或趋势线ItemStyleOpts系列color, border_radius, opacity设置图元颜色与样式这个表格里的参数是我在实际项目里用得最多的基本上覆盖了80%的日常需求。当然Pyecharts的配置项远不止这些遇到特殊需求的时候还是得查官方文档。4. 从零构建一个销售数据看板的完整过程4.1 数据准备与清洗思路假设我们现在有一个销售数据看板的需求数据来源是一张CSV文件包含日期、区域、产品类别、销售额、利润这几个字段。在开始画图之前第一步肯定是把数据读进来并做基本的清洗。import pandas as pd df pd.read_csv(sales_data.csv, encodingutf-8) df[日期] pd.to_datetime(df[日期]) df[月份] df[日期].dt.to_period(M).astype(str) df df.dropna(subset[销售额, 利润]) df[销售额] df[销售额].astype(float) df[利润] df[利润].astype(float)这段代码做了几件事读取CSV、把日期列转成日期类型、提取月份字段、删除销售额或利润为空的记录、确保数值列是浮点类型。这些操作看起来简单但实际项目中数据质量往往参差不齐不做清洗直接画图很容易出现各种奇怪的显示问题。提示如果数据量比较大比如超过10万行建议先在Pandas里做聚合把汇总后的结果传给Pyecharts。Pyecharts本身是前端渲染数据量太大会导致浏览器卡顿。4.2 柱状图与折线图的组合使用销售看板里最常见的图表就是柱状图和折线图的组合柱状图展示销售额折线图展示增长率或者利润率。Pyecharts支持通过overlap方法把多个图表叠加在一起。from pyecharts.charts import Bar, Line from pyecharts import options as opts monthly df.groupby(月份).agg({销售额: sum, 利润: sum}).reset_index() bar ( Bar() .add_xaxis(monthly[月份].tolist()) .add_yaxis(销售额, monthly[销售额].round(2).tolist(), yaxis_index0) .extend_axis(yaxisopts.AxisOpts(name利润, positionright)) .set_global_opts( title_optsopts.TitleOpts(title月度销售与利润趋势), yaxis_optsopts.AxisOpts(name销售额, positionleft), tooltip_optsopts.TooltipOpts(triggeraxis, axis_pointer_typecross) ) ) line ( Line() .add_xaxis(monthly[月份].tolist()) .add_yaxis(利润, monthly[利润].round(2).tolist(), yaxis_index1) .set_series_opts(label_optsopts.LabelOpts(is_showFalse)) ) bar.overlap(line) bar.render(sales_dashboard.html)这里的关键点在于extend_axis和yaxis_index的配合使用。extend_axis给柱状图增加了一个右侧的Y轴然后折线图通过yaxis_index1指定使用这个右侧轴。如果不做这个设置折线图的数值会跟柱状图共用一个Y轴导致利润线被压得很低看起来几乎是一条直线。4.3 饼图与环形图的细节处理饼图在展示占比关系的时候很直观但Pyecharts的饼图有一些细节需要特别注意。比如标签重叠的问题当某个分类的占比很小时标签可能会挤在一起。解决办法是调整标签的位置或者使用环形图。from pyecharts.charts import Pie region_sales df.groupby(区域)[销售额].sum().reset_index() pie ( Pie() .add( , [list(z) for z in zip(region_sales[区域].tolist(), region_sales[销售额].round(2).tolist())], radius[40%, 70%], center[50%, 50%], rosetyperadius ) .set_global_opts( title_optsopts.TitleOpts(title各区域销售占比), legend_optsopts.LegendOpts(orientvertical, pos_left5%, pos_top20%) ) .set_series_opts( label_optsopts.LabelOpts(formatter{b}: {d}%) ) ) pie.render(region_pie.html)radius参数设置成[40%, 70%]就变成了环形图内圈留白可以用来放标题或者总计数据。rosetyperadius会让每个扇区的半径根据数值大小变化视觉上更有层次感。标签的formatter参数支持模板变量{b}代表数据项名称{d}代表百分比{c}代表数值。4.4 地图图表的配置与数据映射如果销售数据包含省份或城市字段用地图来展示会非常直观。Pyecharts的地图图表需要先安装对应的地图包然后通过Map类来创建。from pyecharts.charts import Map province_sales df.groupby(省份)[销售额].sum().reset_index() map_chart ( Map() .add( 销售额, [list(z) for z in zip(province_sales[省份].tolist(), province_sales[销售额].round(2).tolist())], china ) .set_global_opts( title_optsopts.TitleOpts(title全国销售分布), visualmap_optsopts.VisualMapOpts( max_province_sales[销售额].max(), min_province_sales[销售额].min(), is_piecewiseFalse, range_color[#E0F3F8, #4575B4, #313695] ) ) ) map_chart.render(china_map.html)visualmap_opts是地图图表的核心配置它控制颜色梯度的映射范围。is_piecewiseFalse表示使用连续渐变而不是分段颜色range_color定义了从低到高的颜色过渡。实际使用中我建议把max_和min_设置成数据的实际最大最小值这样颜色对比最明显。注意地图数据里的省份名称必须跟地图包里的名称完全匹配比如“广东省”和“广东”在某些地图包里是不通用的。如果发现某个省份没有颜色先检查名称是否一致。5. 把图表嵌入Web框架的几种方式与选择依据5.1 生成独立HTML文件的方式最简单的方式就是调用render()方法生成一个独立的HTML文件然后通过Web服务器的静态文件服务提供给浏览器访问。这种方式适合图表不需要频繁更新、或者更新频率很低的场景。bar.render(static/charts/sales.html)生成的HTML文件包含了完整的ECharts库和图表配置文件大小通常在几百KB到几MB之间。如果图表数量多每个都生成独立文件会导致静态资源体积膨胀。这时候可以考虑用render_embed()方法只生成图表部分的HTML代码然后嵌入到已有的页面模板里。5.2 在Flask中动态渲染图表Flask是Python里最轻量的Web框架之一跟Pyecharts配合起来很顺手。核心思路是在视图函数里生成图表对象然后通过render_template把图表的HTML代码传给模板。from flask import Flask, render_template from pyecharts.charts import Bar from pyecharts import options as opts app Flask(__name__) app.route(/dashboard) def dashboard(): bar ( Bar() .add_xaxis([一月, 二月, 三月]) .add_yaxis(销售额, [120, 200, 150]) .set_global_opts(title_optsopts.TitleOpts(title销售概览)) ) return render_template(dashboard.html, chartbar.render_embed()) if __name__ __main__: app.run(debugTrue)对应的模板文件dashboard.html里只需要用{{ chart | safe }}把图表代码渲染出来就行。这里的关键是render_embed()方法它返回的是图表的HTML片段不包含html和body标签适合嵌入到已有页面中。5.3 在Django中集成图表的注意事项Django的项目结构比Flask复杂一些但集成Pyecharts的思路是一样的。需要注意的是Django的模板引擎默认会转义HTML标签所以要用|safe过滤器。另外Django的静态文件管理比较严格如果图表需要加载额外的JS库要确保这些库放在STATICFILES_DIRS配置的目录下。Pyecharts默认会从CDN加载ECharts库如果项目部署在内网环境需要把ECharts的JS文件下载到本地然后通过CurrentConfig.ONLINE_HOST修改加载路径。from pyecharts.globals import CurrentConfig CurrentConfig.ONLINE_HOST /static/echarts/这段配置要放在所有图表代码之前执行否则不生效。5.4 前后端分离场景下的数据接口设计如果项目是前后端分离的架构后端只负责提供数据接口前端用Vue或React来渲染图表那Pyecharts的角色就变成了“数据格式化工具”。你可以用Pyecharts生成图表的配置项JSON然后通过API返回给前端前端用ECharts直接渲染。import json from pyecharts.charts import Bar from pyecharts import options as opts def get_chart_config(): bar ( Bar() .add_xaxis([一月, 二月, 三月]) .add_yaxis(销售额, [120, 200, 150]) .set_global_opts(title_optsopts.TitleOpts(title销售概览)) ) return bar.dump_options_with_quotes() # 在视图函数中返回 # return JsonResponse(json.loads(get_chart_config()))dump_options_with_quotes()方法返回的是图表配置的JSON字符串前端拿到之后直接传给ECharts的setOption方法就行。这种方式的好处是前后端职责清晰后端只管数据前端只管渲染。6. 实际项目中容易踩的坑与排查思路6.1 图表不显示或显示不全的常见原因图表不显示是新手最容易遇到的问题原因通常有以下几种第一种是数据格式不对。Pyecharts要求X轴数据是列表Y轴数据也是列表而且两个列表的长度必须一致。如果长度不一致图表可能只显示部分数据或者完全不显示。排查方法是打印一下数据的长度和类型确认没有None值或者嵌套列表。第二种是配置项冲突。比如同时设置了xaxis_opts的type_category和boundary_gapFalse在某些版本下会导致X轴标签不显示。遇到这种情况先把所有配置项注释掉只保留最基本的add_xaxis和add_yaxis确认图表能正常显示后再逐个加回配置项。第三种是浏览器缓存。Pyecharts生成的HTML文件引用了CDN上的ECharts库如果网络不通或者CDN被墙图表就加载不出来。解决办法是把ECharts库下载到本地修改CurrentConfig.ONLINE_HOST指向本地路径。6.2 中文乱码与字体设置中文乱码通常出现在图表标题、坐标轴名称或者数据标签里。Pyecharts默认使用浏览器自带的字体渲染一般情况下不会乱码。但如果你的HTML文件没有声明UTF-8编码或者数据源本身的编码不对就可能出现乱码。解决办法是在生成HTML的时候确保编码正确bar.render(chart.html, encodingutf-8)另外如果图表要嵌入到已有的网页里确保那个网页的meta charsetutf-8声明存在。如果还是乱码检查一下数据源文件的编码用chardet库检测一下实际编码格式。6.3 大数据量下的性能优化当数据点超过几千个的时候图表渲染会明显变慢浏览器可能会卡顿甚至崩溃。这时候有几个优化方向一是数据聚合。把原始数据按时间维度或者分类维度做汇总减少数据点的数量。比如把按天统计的数据聚合成按周或按月。二是使用DataZoom组件。Pyecharts支持添加数据区域缩放组件让用户自己选择查看哪个时间段的数据。这样初始渲染的时候只需要加载部分数据。from pyecharts.charts import Line from pyecharts import options as opts line ( Line() .add_xaxis(x_data) .add_yaxis(数值, y_data) .set_global_opts( datazoom_optsopts.DataZoomOpts( is_showTrue, type_slider, range_start0, range_end20 ) ) )三是关闭动画效果。Pyecharts默认会播放渲染动画数据量大的时候动画会消耗大量计算资源。可以通过set_global_opts里的animation_opts关闭动画animation_optsopts.AnimationOpts(animationFalse)6.4 图表导出与分享的实用技巧Pyecharts生成的HTML文件可以直接发给别人对方用浏览器打开就能看到交互效果。但如果对方需要的是图片格式就需要用到截图功能。前面提到过截图需要安装snapshot-selenium或snapshot-phantomjs。安装完成之后调用make_snapshot方法from pyecharts.render import make_snapshot from snapshot_selenium import snapshot make_snapshot(snapshot, bar.render(), chart.png)这个功能在生成报告或者做PPT的时候特别有用。不过要注意snapshot-selenium需要本地有Chrome浏览器和对应的驱动配置起来稍微麻烦一点。如果只是偶尔用一次也可以直接用浏览器的截图功能或者用render()生成HTML后用浏览器的“打印为PDF”功能导出。提示如果图表里有动态加载的数据截图之前要确保数据已经渲染完成否则截出来的图可能是空白的。可以在make_snapshot之前加一个time.sleep(2)等待渲染。7. 从Pyecharts出发的进阶方向Pyecharts本身是一个相对轻量的库它的定位是“让Python开发者能快速生成ECharts图表”。但如果你在可视化这条路上走得比较深可能会遇到一些Pyecharts覆盖不了的需求比如复杂的自定义交互、三维图表、大规模数据渲染等等。这时候有几个方向可以考虑一是直接使用ECharts的JavaScript API虽然学习曲线陡一点但灵活度最高二是用Pyecharts生成基础配置然后在前端用ECharts的setOption方法做二次修改三是考虑其他Python可视化库比如Plotly Dash、Bokeh这些它们在交互性和大数据量支持上各有优势。不过对于大多数Web项目来说Pyecharts已经足够用了。它的优势在于上手快、跟Python生态结合紧密、生成的图表颜值在线。我自己的经验是先把Pyecharts用熟理解清楚ECharts的配置项逻辑后面就算换到其他工具底层的思路也是相通的。最后分享一个我在实际项目里总结的小技巧如果你需要频繁调整图表样式可以先把配置项写在一个独立的Python字典里然后用**kwargs的方式传给set_global_opts。这样修改样式的时候只需要改字典不用动图表生成的逻辑代码维护起来会轻松很多。

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价 →
↑