[[382344]]

 在可視化工作中，我們通常會(huì)根據(jù)數(shù)據(jù)的維度分類來制作圖表，比如用戶性別、年齡段、地區(qū)等自然屬性，抑或是用戶等級(jí)、活躍程度、是否付費(fèi)等行為屬性。這時(shí)就需要把各屬性值組合在一起進(jìn)行比較，但量少了還好說，一旦屬性值過多，很容易使得繪圖區(qū)混亂擁擠，嚴(yán)重影響數(shù)據(jù)的表達(dá)效果。

當(dāng)我們面對(duì)這種情況時(shí)，一般會(huì)采取刪減不重要、不必要的數(shù)據(jù)項(xiàng)或者增加圖表數(shù)量，此外也確實(shí)沒有什么多么高效的解決方案。

下面我們?yōu)榇蠹医榻B一下pyecharts中是如何利用時(shí)間軸來組合多個(gè)圖表的。

顧名思義，時(shí)間軸就是一條軸，上面有多個(gè)節(jié)點(diǎn)，狹義上可以把每個(gè)節(jié)點(diǎn)理解為年、月、日等時(shí)間節(jié)點(diǎn)，當(dāng)然引申一下它還可以表示除時(shí)間以外的其他屬性。

 舉個(gè)例子 

有A-J一共10個(gè)商品品類，每個(gè)品類下面有5個(gè)商品，我們要展示這10*5個(gè)商品2020年每個(gè)月的銷量，數(shù)據(jù)如下圖

10個(gè)品類倒并不算多，但是每個(gè)品類下又有5個(gè)商品，兩個(gè)維度較差后就成了50個(gè)，如果我們把這50個(gè)全都放在一張圖里，肯定是密密麻麻難以區(qū)分。所以我們使用時(shí)間軸的方式，把品類和商品兩個(gè)維度分別表示。

看看效果 

如上圖效果，可以簡(jiǎn)單地理解為每個(gè)品類做一張圖，每張圖里用5條曲線表示每個(gè)商品，最后將這10張圖疊加到一起。最下面的組件即為時(shí)間軸，軸上10個(gè)點(diǎn)分別表示對(duì)應(yīng)的品類，點(diǎn)擊即可切換。

 如何實(shí)現(xiàn) 

import pandas as pd 
import numpy as np 
from pyecharts import charts, options 
 
data = pd.read_excel('商品銷量.xlsx') 
timeline = charts.Timeline(init_opts=options.InitOpts(width='1200px', height='600px')) 
timeline.add_schema(axis_type='category', orient='horizontal', symbol='circle', symbol_size=10, 
                    play_interval=3000, is_auto_play=True, is_loop_play=True, is_timeline_show=True, 
                    control_position='left', pos_left='10%', pos_bottom='0%', width='800px', height='30px') 
for i in list(set(data['品類'])): 
    line = charts.Line(init_opts=options.InitOpts(width='1200px', height='600px')) 
    line.add_xaxis([str(x) for x in range(1, 13)]) 
    line.set_global_opts( 
        title_opts=options.TitleOpts('各商品銷量趨勢(shì)圖', pos_left='50%'), 
        legend_opts=options.LegendOpts(is_show=True, pos_top='50%', pos_right='0%', orient='vertical')) 
    for j in list(set(data.loc[data['品類'] == i, '商品'])): 
        line.add_yaxis(series_name=j, 
                       y_axis=list(data.loc[np.array(data['品類'] == i) & np.array(data['商品'] == j), '銷量'])) 
    timeline.add(chart=line, time_point=i) 
timeline.render('timeline.html') 

 這都是啥玩意兒

第一步，讀取excel文件不必多說。

然后就是創(chuàng)建時(shí)間軸對(duì)象，和普通圖表類型一樣進(jìn)行初始化配置，我們這里只設(shè)置高和寬。接下來是設(shè)置時(shí)間軸的相關(guān)屬性：

1.axis_type表示時(shí)間軸類型，值可以是value(連續(xù)數(shù)值型)、category(離散型)、time(時(shí)間)，如果是time，程序會(huì)自動(dòng)計(jì)算時(shí)間間隔選擇合適的顯示格式，此處我們適用的是category

2.orient是時(shí)間軸的放置方向，取值為vertical(垂直)或horizontal(水平)

3.symbol用來定義時(shí)間軸上節(jié)點(diǎn)的圖標(biāo)，如：'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'

4.symbol_size控制節(jié)點(diǎn)圖標(biāo)的大小

5.時(shí)間軸會(huì)附帶一個(gè)播放按鈕，點(diǎn)擊可以播放和暫停，使用play_interval來控制節(jié)點(diǎn)的切換時(shí)間間隔，單位是毫秒

6.將is_auto_play設(shè)置為True，頁(yè)面打開后將會(huì)自動(dòng)播放

7.is_loop_play則表示循環(huán)播放

8.is_timeline_show就是頁(yè)面是否顯示時(shí)間軸組建

9.control_position是播放按鈕的位置，left、right

10.pos_left、pos_right、pos_top、pos_bottom則是控制時(shí)間軸位置的參數(shù)，分別表示時(shí)間軸離容器左、右、上、下側(cè)的距離，可以是百分比也可以是絕對(duì)值

11.height和width就是時(shí)間軸的高度和寬度

時(shí)間軸屬性配置完成后，使用循環(huán)的方式，把每次創(chuàng)建的圖表對(duì)象line添加到timeline上即可。這里只是以折線圖為例，實(shí)際上時(shí)間軸可以對(duì)多種圖表類型進(jìn)行組合，比如多個(gè)餅圖、多個(gè)地圖，或者是不同圖表類型之間也可以在同一個(gè)時(shí)間軸中實(shí)現(xiàn)自由切換。

看到這里，大家應(yīng)該明白，時(shí)間軸其實(shí)就是類似于excel中切片器的一個(gè)篩選工具，是將多個(gè)圖表疊加在一起，然后手動(dòng)或自動(dòng)切換每個(gè)圖表。這樣的好處是，在有限的畫圖區(qū)域盡可能清晰有序地展示出所有信息。