作者：ssw來源：Python 技術echarts官網有很多好看的圖例，怎麼結合起來放到自己的項目中呢？比如這種酷酷的首頁：這種看起來美觀又大方，自己要是能用上就好瞭。其實這是可以的，echarts上有現成的圖例和示例代碼，咱們隻要改改數據源就可以瞭，至於好看的佈局，比如上圖這種，我們直接借鑒過來不就可以瞭。以公司網頁為例，簡單介紹一個例子，下圖這麼多網址的巡檢如何用一個圖例來展示。可以把它們寫到文件裡：先創建一個文件，比如叫config.cfg[url]
優酷 = http://www.youku.com/
錯誤網址 = http://www.111.cn/
安裝configparser模塊pip install configparser
讀取這些網址import configparser
cfg = configparser.ConfigParser()
cfg.read('config.cfg',encoding='utf-8')
urls = cfg.items('url')
print(urls)
結果如下：[('優酷', 'http://www.youku.com/'), ('錯誤網址', 'http://www.111.cn/')]
echarts官網找圖接下來，怎麼展示網站的狀態碼是否為200呢？echarts上找瞭一下，看到一個“極坐標柱狀圖”，很適合這種判斷True or False的場景，比如網頁狀態碼是否為200，是返回1，否返回0，然後將echarts的數據源替換成我們的就是這種效果：數值為1（代表正常）的條目會顯示藍條，0為異常則用紅色文字打印出來，整體巡檢效果如下：檢查urlrequests模塊判斷狀態碼是否為200import requests
def check_url(url):
try:
r = requests.get(url, timeout=10)
return r.status_code
except Exception as e:
return e
把config.cfg讀到的網址，利用check_url函數檢查完放到一個列表中urls_state = []
for url in urls:
status_code = check_url(url[1])
if status_code == 200:
urls_state.append([0,1])
else:
urls_state.append([1, 1,url[0]+' ConnectTimeout'])
結果如下：[
[0, 1],
[1, 1, '優酷 ConnectTimeout'],
[0, 1],
[1, 1, '錯誤網址 ConnectTimeout']
]
把這些信息返回給前端from rest_framework.views import APIView

class get_urls(APIView):
def get(request,*args,**kwargs):
urlsState = check_url.main()

#網頁的名字列表
cities = ['公司主頁', 'maas', 'maas1', 'maas2', 'maas3', 'maas4', '1小貓咪', '2小貓咪', '3小貓咪', '4小貓咪', '5小貓咪', '6小貓咪', '7小貓咪', '8小貓咪', '9小貓咪','10小貓咪','11小貓咪','12小貓咪', 'maas4','maas5', 'maas6','maas7', 'maas8', 'maas9', 'maas10', 'maas11','maas15', 'maas13', 'maas14', 'maas', '數據可視化系統', 'maas', 'maas', 'x1', 'maas','maas']
return JsonResponse({'data': {
'urlsData':{'name':'網頁','urlsState':urlsState,'cities':cities},
}})
這樣前端在判斷的時候，如果某個url信息的長度為3，說明有錯誤信息urlsState.forEach(key => {
if (key.length == 3) {
this.echartData.urls.info.push(key[2] + '\n')
}
})小結這是一個很好的例子：前後端分離動態更新echarts數據用到DjangoRESTframework更重要的是通過合並第1、2步，從檢查到展示能一步到位，領導見瞭直誇有想法。