对于一些没有编程经验的小白来说，看到这类动态排序条形图视频比较震撼，自己也想做，但是又有看到大段的代码就头疼的症状，鉴于有学员需要，这次就选择一个最简单的方式创建这类动态的排序图。

操作前准备：

    善于利用别人的经验不仅可以提高自己的工作效率而且可以少走很多弯路，这里是使用别人封装好的模块，模块的下载地址及有关代码和软件包已经打包好，网址为https://github.com/Muzi828/Historical-ranking-data-visualization

    打开网址链接后，点击右侧的download ZIP,将文件下载到桌面解压，前期准备工作完成

模块用法

使用模块创建者自己的话来说就是：只需打开src目录下的bargraph.html。然后点击页面中间的选择文件按钮，接着选择csv格式的数据文件，便可以看到可视化的结果。比如将文件解压完成后，在与bargraph.html文件同一界面有个demo.csv文件，在打开bargraph.html网页文件后，可以直接点选这个文件就可以进行展示。如下：

数据格式

注意：该模块能够读取csv格式的数据，具体的格式如下。

其中“名称”会出现在柱状图的左侧作为Y轴，而“类型-名称”会作为附加信息出现在柱状图上。

类型与柱状图的颜色相关，建议命名为不包含空格或者特殊符号的中英文字符。

值与柱状图的长度绑定，必须是整数或浮点数。

日期建议使用的格式为"YYYY-MM-DD"

配置

打开config.js的文件即可进行一些参数的修改（建议下载sublime，轻便，文件压缩包和中文版都已经在链接中给出）。

实战案例

通过成功运行给出的demo.csv文件，不难看出只要是按照数据格式要求进行数据的录入，然后打开网页直接选择这个文件，就可以完成历年数据动态排序的可视化。这里是以B站喜欢的几位up主做为name一列，value值假设是为一天的涨粉情况（这里使用随机数来代替真实数据，仅仅做数据处理的展示），date设置为2019/10/1-2019/10/30，type一栏这里由于没有要求所以没有进行设置。代码如下：

import pandas as pd
import numpy as np
df = pd.DataFrame({"name":"华农兄弟","value":np.random.randn(30)*1000,"date":pd.period_range("2019/10/1","2019/10/30")})
ls_name = ["敬汉卿","王刚","山药","中二所","观视频"]
for name in ls_name:
    df_ = pd.DataFrame({"name":name,"value":np.random.randn(30)*1000,"date":pd.period_range("2019/10/1","2019/10/30")})
    df = pd.concat([df,df_])
df.to_excel(r"C:\Users\86177\Desktop\demo.xlsx",index=False)

代码的前两行是导入功能库，第三行代码的是完成一个表单（DataFrame）的创建，用于组合之后的表单数据，第4-7行中，实际在功能上4-6行代码是对第3行代码的重复，为了避免大量重复的出现，才用了列表遍历循环的方式，第7行是将每遍历的一个表单数据进行组合，最后生成一个究极版的表单，最后一行代码是将这个表单写入桌面的demo.xlsx文件中（直接保存.csv格式，有时会出现数据分割不当的现象，导致数据读取错误），之所以生成.xlsx，一是为了保存原数数据，二是其转化为.csv较为方便，只需要在修改后（因为没有type的数据，所以还需在demo.xlsx手动插入名为type的一列，不添加数据），然后另存为demo.csv格式文件。

 

设置config.js里面相关的参数，如果出现中文乱码，可以将encoding后设置为 "UTF-8"，在附加信息的两个选项中left label也就是左上角显示的信息，设置成itemLabel: "涨粉最多：", 右侧的保持无输入，不进行修改，其余的参数可以按照自己的喜好进行修改，记住修改之后点击保存。

最后一步就是一切准备就绪后，按照模块用法，打开bargraph.html，选择文件对应于demo.csv,之后就会出现下图：

拓展延伸

以上的实战案例是对每一天的数据进行动态排序的可视化，如果我们想进行30天各位up主累计涨粉的动态可视化，难道是要除第一天外，其余隔天的数据依次进行累加？其实按照数据的格式要求，就是酱紫的。所以要进行这不操作只需要再添加一行代码就可以搞定了，全部代码如下：

import pandas as pd
import numpy as np
df = pd.DataFrame({"name":"华农兄弟","value":np.random.randn(30)*1000,"date":pd.period_range("2019/10/1","2019/10/30")})
df["value"]= df["value"].cumsum(axis=0)
ls_name = ["敬汉卿","王刚","山药","中二所","观视频"]
for name in ls_name:
    df_ = pd.DataFrame({"name":name,"value":np.random.randn(30)*1000,"date":pd.period_range("2019/10/1","2019/10/30")})
    df_["value"]= df_["value"].cumsum(axis=0)
    df = pd.concat([df,df_])
df.to_excel(r"C:\Users\86177\Desktop\demo_acc.xlsx",index=False)

  添加的这行代码就是在value这一列，进行数据的逐步累计 ，其余的操作不变就可以完成30天内up主涨粉累计的动态排序可视化。结果运行如下图