一、問題背景
前情提要（第5.8章節）：
【Python視覺化大屏】全流程揭祕實現視覺化資料大屏的背後原理！
在用Page函式拖拽組合完大屏時，點選頁面左上角的Save Config，會生成一個檔案：chart_config.json
這個檔案是什麼？有什麼作用？怎麼高效利用它？
二、揭開json檔案神祕面紗
開啟json檔案後，如下：
json是一個由dict組成的列表，每個dict的key分別是：
- cid：chart_id，圖表的唯一標識
- width：圖表的寬度
- height：圖表的高度
- top：距離頂部的大小，多少px畫素
- left：距離左側的大小，多少px畫素
也就是說，json檔案以chart_id為標識，記錄了每個圖表的所在大屏的屬性（大小、位置等）
有了這個json配置檔案，下一步生成最終大屏html檔案的時候，pyecharts就知道每個圖表擺放在什麼位置，大小是多少了：
Page.save_resize_html(
source="大屏_臨時.html",
cfg_file="chart_config.json",
dest="大屏_最終.html"
)
是不是很好理解了。
三、巧用json檔案
既然我們理解了json檔案的內容和作用，什麼時候需要用到它呢？
如果你跑完資料，拖拽組合大屏完成，生成了json檔案和最終大屏，發現效果圖表有問題，資料不對，但是大屏的圖表沒問題，都很美觀，此時，只需要重新跑一遍資料，不需要重新組合拖拽大屏，就可以巧妙利用這個json檔案。
所以，關鍵點來了（敲黑板！期末要考！！）
在開發各個子圖表時，一定要在每個圖表的初始化配置項opts.InitOpts裡面，設定上chart_id，就像這樣：
詞雲圖：
WordCloud(init_opts=opts.InitOpts(width="450px", height="350px", theme=theme_config, chart_id='wc1'))
漣漪散點圖：
EffectScatter(init_opts=opts.InitOpts(width="450px", height="350px", theme=theme_config, chart_id='scatter1'))
柱形圖:
Bar(init_opts=opts.InitOpts(theme=theme_config, width="450px", height="350px", chart_id='bar_cmt1'))
每個圖表都設定了chart_id（重點！）
不然儲存json檔案時，pyecharts會給圖表生成隨機的chart_id，後面巧用json檔案時就會很麻煩，需要手動替換chart_id了！
當把最新的資料重新跑完，生成好大屏_臨時.html後，直接執行3_生成最終大屏.py就行，
不需要重新拖拽了！
不需要重新拖拽了！
不需要重新拖拽了！
重要的事情說三遍。
非常快速高效的生成最終大屏！（因為chart_config.json裡面已經記錄了上次拖拽的結果）
非常優雅對不對？
好了，關於chart_config.json的剖析就到這裡！
四、關於Table圖表
關於pyecharts裡的Table元件，這裡需要特殊說明。
由於Table不是Echarts框架的標準圖表型別，屬於HTML的原生表格，所以它不支援設定chart_id。（關於此事，我特意諮詢了pyecharts框架的原作者 ，在此感謝大佬解答！）
所以，只能從臨時大屏的html檔案裡，找出table的chart_id，把它貼上到json檔案中，才可以繼續巧用josn檔案。
五、同步講解視訊
5.1 講解json的視訊
https://www.zhihu.com/zvideo/1509818909490876416
5.2 講解全流程大屏的視訊
https://www.zhihu.com/zvideo/1503013679826690048
5.3 講解全流程大屏的文章
https://zhuanlan.zhihu.com/p/505408710
by： 馬哥python說