用 Python 制作可视化报表，这也太快了！
作者 | 小F
来源 | 法纳斯特
在数据展示中使用图表来分享自己的见解，是个非常常见的方法。
这也是Tableau、Power BI这类商业智能仪表盘持续流行的原因之一，这些工具为数据提供了精美的图形解释。
当然了，这些工具也有着不少缺点，比如不够灵活，无法让你自己创建设计。
当你对图表展示要求定制化时，编程也许就比较适合你，比如Echarts、D3.js。
今天小F给大家介绍一个用Python制作可视化报表的案例，主要是使用到Dash+Tailwindcss。
可视化报表效果如下，水果销售情况一览~
Dash是基于Plotly搭建的Dashbord框架，支持Python、R和Julia。使用Dash，你可以创建自定义响应式仪表板。
相关文档
说明：https://dash.plotly.com/introduction
案例：https://dash.gallery/Portal/
源码：https://github.com/plotly/dash-sample-apps/
Tailwindcss则是一个实用程序优先的CSS框架，用于快速构建自定义界面。
“这种框架只适用于那种只会实现页面布局美化元素而不关心实现业务逻辑的前端”。
看看别人对它的评价，对于无交互的图表，完全足够了。
相关文档
说明：https://www.tailwindcss.cn/docs
GitHub：https://github.com/tailwindlabs/tailwindcss
下面就给大家讲解下如何通过Dash+Tailwindcss搭建可视化报表～
首先安装相关的Python库，然后导入。
import dash
import pandas as pd
import plotly.express as px
from dash import dcc, html使用到了Pandas、Plotly、dash这三个Python库。
我们需要把Tailwindcss的CDN作为external_script，并将其传递给我们的应用程序实例，这样我们才可以成功使用Tailwindcss。
# 导入tailwindcss的CDN
external_script = ["https://tailwindcss.com/", {"src": "https://cdn.tailwindcss.com"}]# 创建Dash实例
app = dash.Dash(__name__,external_scripts=external_script,
)
app.scripts.config.serve_locally = True使用Pandas创建水果销售数据，随便虚构了一个。
# 创建数据
df = pd.DataFrame({"Fruit": ["苹果", "橙子", "香蕉", "苹果", "橙子", "香蕉"],"Amount": [4.2, 1.0, 2.1, 2.32, 4.20, 5.0],"City": ["北京", "北京", "北京", "上海", "上海", "上海"],}
)print(df)结果如下，3列6行，包含水果、销售额、城市列。
处理一下相关的数据，水果单数、销售总额、城市单数、变量数。
# 水果单数
fruit_count = df.Fruit.count()
# 销售总额
total_amt = df.Amount.sum()
# 城市单数
city_count = df.City.count()
# 变量数
variables = df.shape[1]创建图表实例，一个柱状图、一个箱型图。
# 柱状图1, 不同水果不同城市的销售额
fig = px.bar(df, x="Fruit", y="Amount", color="City", barmode="group")# 箱型图1, 不同城市的销售额分布情况
fig1 = px.box(df, x="City", y="Amount", color="City")效果如下。
剩下就是文字模块啦，文字+CSS样式。
其中排版布局美化，通过Tailwindcss来实现。
app.layout = html.Div(html.Div(children=[html.Div(children=[html.H1(children="水果销售--可视化报表", className=" py-3 text-5xl font-bold text-gray-800"),html.Div(children="""Python with Dash = 💝 .""",className="text-left prose prose-lg text-2xl py-3 text-gray-600",),],className="w-full mx-14 px-16 shadow-lg bg-white -mt-14 px-6 container my-3 ",),html.Div(html.Div(children=[html.Div(children=[f"¥{total_amt}",html.Br(),html.Span("总销售额", className="text-lg font-bold ml-4"),],className=" shadow-xl py-4 px-14 text-5xl bg-[#76c893] text-white font-bold text-gray-800",),html.Div(children=[fruit_count,html.Br(),html.Span("水果数量", className="text-lg font-bold ml-4"),],className=" shadow-xl py-4 px-24 text-5xl bg-[#1d3557] text-white font-bold text-gray-800",),html.Div(children=[variables,html.Br(),html.Span("变量", className="inline-flex items-center text-lg font-bold ml-4"),],className=" shadow-xl py-4 px-24 text-5xl bg-[#646ffa] text-white font-bold text-gray-800",),html.Div(children=[city_count,html.Br(),html.Span("城市数量", className="text-lg font-bold ml-4"),],className="w-full shadow-xl py-4 px-24 text-5xl bg-[#ef553b] text-white font-bold text-gray-800",),],className="my-4 w-full grid grid-flow-rows grid-cols-1 lg:grid-cols-4 gap-y-4 lg:gap-[60px]",),className="flex max-w-full justify-between items-center ",),html.Div(children=[html.Div(children=[dcc.Graph(id="example-graph", figure=fig),],className="shadow-xl w-full border-3 rounded-sm",),html.Div(children=[dcc.Graph(id="example-graph1", figure=fig1),],className="w-full shadow-2xl rounded-sm",),],className="grid grid-cols-1 lg:grid-cols-2 gap-4",),],className="bg-[#ebeaee] flex py-14 flex-col items-center justify-center ",),className="bg-[#ebeaee] container mx-auto px-14 py-4",
)效果如下。
最后启动程序代码。
if __name__ == '__main__':# debug模式, 端口7777app.run_server(debug=True, threaded=True, port=7777)# 正常模式, 网页右下角的调试按钮将不会出现# app.run_server(port=7777)这样就能在本地看到可视化大屏页面，浏览器打开如下地址。
http://127.0.0.1:7777
以后制作的图表不仅能在线展示，还能实时更新，属实不错~
好了，今天的分享到此结束，大家可以自行去动手练习。
往
期
回
顾
资讯
Meta开发AI语音助手，助力元宇宙
技术
10个超级常用的Python方法总结
技术
5分钟速通 AI 计算机视觉发展应用
资讯
M2芯片终于要来了？全线换新
分享
点收藏
点点赞
点在看
相关文章：
Django 错误汇总
1、 解决：python manage.py migrate sessions 2、转载于:https://blog.51cto.com/jacksoner/2130665
几种负载均衡算法
几种负载均衡算法 本地流量管理技术主要有一下几种负载均衡算法： 静态负载均衡算法包括：轮询，比率，优先权 动态负载均衡算法包括: 最少连接数,最快响应速度，观察方法，预测法，动态性能分配&#…
cassandra命令
压力测试：cassandra-stress [command] -node [nodes] -mode thrift user[user] password[password] example: cassandra-stress write n10 -node 192.168.0.105 -mode thrift usercassandra passwordcassandra
《2022产业互联网安全十大趋势》发布，专家学者透析产业安全新变化
2月28日，在中国产业互联网发展联盟指导下，人民邮电报、中国信息安全、腾讯安全联合实验室、腾讯研究院联合推出《2022产业互联网安全十大趋势》。该报告由《中国信息安全》杂志出品人温哲、腾讯副总裁丁珂、腾讯研究院院长司晓等20余位行业顶级专家、学者…
slurm用户快速入门手册
1. 概述2. 架构3. 命令3.1 sacct3.2 sattach3.4 sbatch3.5 sbcast3.6 scancel3.7 scontrol3.8 sinfo3.9 smap3.10 squeue3.11 srun3.12 strigger3.13 sview1. 概述 Slurm 是一个开源、容错、高可伸缩的集群管理和大型小型 Linux 集群作业调度系统。slurm不需要对操作系统内核进…
什么是CGI、FastCGI、PHP-CGI、PHP-FPM、Spawn-FCGI？
原文地址：http://www.mike.org.cn/articles/what-is-cgi-fastcgi-php-fpm-spawn-fcgi/什么是CGICGI全称是“公共网关接口”(Common Gateway Interface)，HTTP服务器与你的或其它机器上的程序进行“交谈”的一种工具，其程序须运行在网络服务器上…
5个短小精悍的 Python 趣味脚本，太赞了，非常适合小白上手！
作者 | 菜鸟哥来源 | 菜鸟学Python今天特地为大家准备了几个简单的“开胃小菜”。希望大家能够通过这几个简单而实用的小案例，活跃一下自己的思维，为接下来的工作和学习做好准备。话不多说，我们接下来就开始介绍。1、图片尺寸缩小所需库&…
AjaxFileUpload文件上传组件(php+jQuery+ajax)
jQuery插件AjaxFileUpload可以实现ajax文件上传，下载地址：http://www.phpletter.com/contents/ajaxfileupload/ajaxfileupload.js 主要参数说明：1，url表示处理文件上传操作的文件路径，可以测试URL是否能在浏览器中直接…
Hadoop生态圈-Flume的组件之自定义拦截器（interceptor）
Hadoop生态圈-Flume的组件之自定义拦截器（interceptor） 作者：尹正杰 版权声明：原创作品，谢绝转载！否则将追究法律责任。 本篇博客只是举例了一个自定义拦截器的方法，测试字节传输速度。 1>.自…
Pandas 重复数据处理大全
作者 | 东哥起飞来源 | Python数据科学本次来介绍重复值处理的常用方法。重复值处理主要涉及两个部分，一个是找出重复值，第二个是删除重复值，也就是根据自己设定的条件进行删除操作。定位重复值对于重复值，我们首先需要查看这些重…
DEDECMS教程:上/下一篇文章标题长度的截取方法
对dedecms了解的朋友们，想必对如何获取上一篇、下一篇文章的标签也是非常熟悉。dedecms获取上一篇、下一篇文章的标签分别为：{dede:prenext getpre/}、{dede:prenext getnext}。 在这个标签里，并没有设置上一篇、下一篇文章标题字数的功能&am…
以太网帧最小字节数以及以太网碰撞
说明：本文源自多个网页，原文链接已经不可寻 以太网是无连接的，不可靠的服务，采用尽力传输的机制。以太网CSMA/CD我就不多讲了，我相信大家都了解这个原理。以太网是不可靠的，这意味着它并不知道对方有没有收…
lodash 提取前N个元素 take
_.take(array, [n1])从数组的起始元素开始提取 N 个元素。 <!DOCTYPE html> <html lang"zh"><head><meta charset"UTF-8" /><meta name"viewport" content"widthdevice-width, initial-scale1.0" /><…
JavaScript 中的有限状态机
http://www.ibm.com/developerworks/cn/web/wa-finitemach/JavaScript 中的有限状态机Page navigation系列文章有限状态机很早就已用作设计和实现事件驱动的程序（比如网络适配器和编译器）内复杂行为的组织原则。现在，可编程的 Web 浏览器为新…
健身也内卷？这届网友用 Python 掌握了做标准俯卧撑的秘诀
自己在家锻炼时，我们很难知道自己的动作是否标准。本文作者用Python写了一个可以检测俯卧撑动作是否标准的程序，一起来看看他是怎么做的。 译者 | 章雨铭 出品 | CSDN 在新加坡军队中，有一种测试叫做IPPT（个人身体素质测试&#x…
Linux下配置SNMP
SNMP（Simple NetworkManagement Protocol ）：简单网络管理协议本案列为Linux环境搭建（CentOS-6）使用yum进行安装：yum install -y net-snmp安装完成后先查看网络配置：netstat -anupl确认161端口被…
重磅！MaxCompute助力阿里开源自研语音识别模型DFSMN，准确率高达96.04%
阿里开源语音识别模型DFSMN 在近期举行的云栖大会武汉峰会上，装有DFSMN语音识别模型的“AI收银员”在与真人店员的PK中，在嘈杂环境下准确识别了用户的语音点单，在短短49秒内点了34杯咖啡。此外，装备这一语音识别技术的自动售票机也…
全球网络拓扑图
原文出自海外一个论坛：http://board.us.ikariam.com/board16-miscellaneous/board205-discussion-board/67724-internet/InternetSo, I always take a look at these maps and also information on the workings of the internetAnd I have questions:Are there map…
Python 实现 PD 文字识别、提取并写入 CSV 文件脚本分享
作者 | 一只河马h来源 | 简说Python一、前言二、需求描述三、开始动手动脑3.1 安装相关第三方包3.2 导入需要用到的第三方库3.3 读取pdf文件，并识别内容3.4 对识别的数据进行处理，写入csv文件总结前言扫描件一直受大众青睐，任何纸质资料在扫描…
根据listObject中的某个字段排序
compareTo必须是两个对象之间的比较(比如Long,Integer...),以下例子是升序排序 private void businessSort(List<WxDailyBusinessInfo> wxDailyBusinessInfo) { //排序前for (int i 0; i < wxDailyBusinessInfo.size(); i) {System.out.println(new Gson(…
CC国内厂商现状
（1）阿里云的产品 CC攻击 攻击者攻击服务器的认证页面、登录页面、游戏论坛等。还是用饭馆的例子，CC攻击相当于，坏人霸占收银台结账、霸占服务员点菜，导致正常的客人无法享受到服务。 游戏盾如何防御CC攻击？…
网络模型 - 随机网络，无标度网络，分层网络
转自： http://www.flickr.com/photos/caseorganic/4510691991/in/set-72157624621620243小图大图Network Models - Random network, Scale-free network, Hierarchical network随机网络The Erds–Rnyi (ER) model of a random network14 (see figure, part A) start…
一文介绍机器学习中的三种特征选择方法
作者 | luanhz来源 | 小数志导读机器学习中的一个经典理论是：数据和特征决定了机器学习的上限，而模型和算法只是逼近这个上限。也正因如此，特征工程在机器学习流程中占有着重要地位。广义的特征工程一般可分为三个环节：特征提取、…
[转化率预估-1]引言
原文：hhttp://www.flickering.cn/ads/2014/06/%E8%BD%AC%E5%8C%96%E7%8E%87%E9%A2%84%E4%BC%B0%E2%80%94%E2%80%94%E5%BC%95%E8%A8%80/ 最近几年，“计算广告学”的概念风生水起，让我们这些从事在线广告匹配技术的程序猿着实荣耀了一把。这在参…
reportNG定制化之失败截图及日志
先从github上拉下 reportNg的源代码 reportng 拉下源码后我们使用IDEA进行导入 1、reportng.properties 增加部分类表项 这里我们直接在末尾添加 logLog Info screenshotScreen Shot durationDuration2、results.html.vm 修改结果的html，我们目前只修改fail的情况下…
基于 OpenCV 的手掌检测和手指计数
作者 | 努比 来源 | 小白学视觉 利用余弦定理使用OpenCV-Python实现手指计数与手掌检测。 手检测和手指计数 接下来让我们一起探索以下这个功能是如何实现的。 OpenCV OpenCV（开源计算机视觉库）是一个开源计算机视觉和机器学习软件库。OpenCV的构建旨在为…
side menu待研究
2019独角兽企业重金招聘Python工程师标准>>> http://fontawesome.bootstrapcheatsheets.com/ http://www.queness.com/post/14666/recreate-google-nexus-menu http://www.jqueryscript.net/demo/Sliding-Side-Menu-Panel-with-jQuery-Bootstrap-BootSideMenu/ &a…
Gitlab Issue Tracker and Wiki(一)
本节内容：创建第一个问题创建第一个合并请求接受合并请求工作里程碑在提交中引用问题创建维基百科页使用Gollum管理维基百科一. 创建问题1. 登陆Gitlab服务器2. 切换到想要创建问题的项目3. 点击Issues.4. 点击【New issue】5. 根据情况进行填写。二. 创建合并请求1…
runtime实践之Method Swizzling
利用 Objective-C 的 Runtime 特性，我们可以给语言做扩展，帮助解决项目开发中的一些设计和技术问题。这一篇，我们来探索一些利用 Objective-C Runtime 的黑色技巧。这些技巧中最具争议的或许就是 Method Swizzling 。 介绍一个技巧࿰…
网络协议关系拓扑图 很全面 很好
NETWORK ASSOCIATES GUIDE TO COMMUNICATIONS PROTOCOLS 网络协议关系拓扑图 很全面 很好 值得收藏！