本期Python学习教程，精讲报表和日志

导出Excel报表

报表就是用表格、图表等格式来动态显示数据，所以有人用这样的公式来描述报表：

报表 = 多样的格式 + 动态的数据

有很多的三方库支持在Python程序中写Excel文件，包括xlwt、xlwings、openpyxl、xlswriter、pandas等，其中的xlwt虽然只支持写xls格式的Excel文件，但在性能方面的表现还是不错的。下面我们就以xlwt为例，来演示如何在Django项目中导出Excel报表，例如导出一个包含所有老师信息的Excel表格。

概要说明

瀑布图采用绝对值与相对值结合的方式，来表达数个特定数值之间的数量变化关系。这种效果的图形能够在反映数据多少的同时，更能直观反映出数据的增减变化过程。

瀑布图的特点说明如下：

优势：展示两个数据点之间的演变过程。

劣势： 没有柱状图的使用场景多，适用情况单一。

数据要求：一个分类值，一个指标值。数据之间要有演变过程 。

适用场景： 适用于解释两个数据值之间的差异是由哪几个因素贡献，每个因素的贡献比例，展示两个数据值之间的演变过程。例如：某公司当年的现金流情况，从年初的现金流，经过当年各种增加、减少的情况，最终演变成年底的现金流。

项目素材地址： https://gitee.com/xiaoqiang001/eckarts_open_class.git

学习目的：

1、可视化面板布局适配屏幕

2、利用ECharts 实现柱状图展示

核心技术：

-基于 flexible.js + rem 智能大屏适配

- VScode cssrem插件

- Flex 布局

- Less 使用

- 基于ECharts 数据可视化展示

1.echarts

ECharts是一款基于JavaScript的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。ECharts最初由百度团队开源，并于2018年初捐赠给Apache基金会，成为ASF孵化级项目。

ECharts 提供了常规的折线图、柱状图、散点图、饼图、K线图，用于统计的盒形图

官网：

https://echarts.apache.org/zh/index.html

ECharts，全称Enterprise Charts，是一款由百度团队开发并开源，后捐赠给Apache基金会的纯JavaScript图表库。它提供了直观、生动、可交互、可个性化定制的数据可视化图表，广泛应用于数据分析、商业智能、网页开发等领域。以下是关于ECharts的详细介绍：

一、建立最新的Vue3工程

npm init vue@latest

二、安装ECharts

npm install echarts --save

导读：echarts是一个基于 JavaScript 的开源可视化图表库，里面包含很多常用且美观的统计图表。作者就通过使用中继器，结合echart的图标代码，做出可视化图表的原型模板，一起来看一下吧。

echarts是一个基于 JavaScript 的开源可视化图表库，里面包含很多常用且美观的统计图表。但是由于大部分产品经理不太懂代码，导致他们在画原型图的时候，不能直接使用该工具，就算会代码，使用起来也不太方便。所以作者就通过使用中继器，结合echart的图标代码，做出可视化图表的原型模板，用户使用该模板时只需在中继器表格中填入数据，就能够自动生成echart图表，且实现高保真的交互效果。下面，我会通过饼图的案例作为教程，具体效果如下：

最近在对工作中的数据进行分析，本着自己是个业余程序员的身份，想卖弄下自己的小技术，想起之前使用过的图表控件Echarts，果断上网搜索一波。

有段时间没用过Echarts了，更新升级跨度比较大，功能更强了，内容也更丰富了，啥也不说了，直接用起来。

第一步：上官网，下载

我们的目的就是快速的用起来，所以直接选择从GitHub下载编译产物，找到echarts.min.js脚本文件，直接下载到本地

第二步：新建网页文件，引入Echart脚本文件

源代码和教案（访问密码：7567）

坐标轴数据太多，只能滚动显示，滚动的时候，不想缩放，单纯平移就好。

option = {
          title: {
            // text: 'World Population',
          },
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'shadow',
            },
          },
          legend: {},
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true,
          },
          axisLine: {
            show: false,
          },

          xAxis: {
            type: 'value',
            min:0,
            max:25, //指定一个x轴的最大值，才会再滚动到第二屏的时候柱形长度不变长
          },
          dataZoom: [
            {
              type: 'inside', // 支持内部鼠标滚动平移
              start: 25,
              end: 100,
              yAxisIndex: 0,
              zoomOnMouseWheel: false, // 关闭滚轮缩放
              moveOnMouseWheel: true, // 开启滚轮平移
              moveOnMouseMove: false, // 鼠标移动能触发数据窗口平移
            },
          ],
          yAxis: {
            type: 'category',
            axisTick: {
              show: false,
            },
            minInterval: 1,
            axisLine: {
              show: false,
            },
            // min: 1, // 设置 y 轴显示的最小值
            // max: 50, // 设置 y 轴显示的最大值
            data: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K","L", "M", "N", "O", "P"],
          },

          series: [
            {
              // name: '2011',
              type: 'bar',
              data: [2, 1,1, 1, 1,1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 25],
              boundaryGap: false, // 关闭坐标轴两端的空白
              // min: , // 设置 y 轴显示的最小值
              // max: 11, // 设置 y 轴显示的最大值
              barWidth: 10, // 柱条的宽度,不设时自适应
              itemStyle: {
                color: 'rgba(147,98,246,1)',
              },
              label: {
                show: true,
                position: 'right',
                color: 'rgba(147,98,246,1)',
                fontSize: 14,
              },
            },
          ],
        }