快捷導(dǎo)航

django echarts餅圖數(shù)據(jù)動(dòng)態(tài)加載的實(shí)例

更新時(shí)間：2019年08月12日 09:16:30 作者：LisaYang94

今天小編就為大家分享一篇django echarts餅圖數(shù)據(jù)動(dòng)態(tài)加載的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧

如下所示：

后臺(tái)關(guān)鍵代碼：

data = {}
#keys與values分別為該數(shù)據(jù)的鍵數(shù)組，值的數(shù)組。這里循環(huán)為字典添加對(duì)應(yīng)鍵值
for k, v in zip(keys, values):
  data.update({k: v, },)
#最后將數(shù)據(jù)打包成json格式以字典的方式傳送到前端
return render(request, 'index.html', {'data': json.dumps(data)})

網(wǎng)頁(yè)（js中）取值關(guān)鍵代碼：

1.取值：

var kv = new Array();//聲明一個(gè)新的字典
kv = {{ data|safe }};//取出后臺(tái)傳遞的數(shù)據(jù)，此處添加safe過(guò)濾避免警告
var test = new Array();//聲明一個(gè)新的字典用于存放數(shù)據(jù)
for (var logKey in kv) {
//將對(duì)應(yīng)鍵值對(duì)取出存入test，logKey 為該字典的鍵
  test.push({value: kv[logKey], name: logKey});
}

2.餅圖賦值：

var option = {
  title: {
  show:true,
  fontSize : 15,
  text: '數(shù)據(jù)測(cè)試'
    },
  series: [{
    type: 'pie',
    radius: '55%',
    data:test,//賦值方式為字典傳值
  }]
 }

效果圖：

以上這篇django echarts餅圖數(shù)據(jù)動(dòng)態(tài)加載的實(shí)例就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Python裝飾器使用你可能不知道的幾種姿勢(shì)
這篇文章主要給大家介紹了關(guān)于Python裝飾器使用你可能不知道的幾種姿勢(shì)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者使用Python具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-10-10
Python Zipfile模塊進(jìn)行ZIP文件的創(chuàng)建解壓信息獲取和加密等操作
這篇文章主要為大家介紹了Python Zipfile模塊進(jìn)行ZIP文件的創(chuàng)建解壓信息獲取和加密等操作,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
2024-01-01
python pandas分組聚合詳細(xì)
分組聚合是數(shù)據(jù)處理中常見(jiàn)的場(chǎng)景，在pandas中用groupby方法實(shí)現(xiàn)分組操作，用agg方法實(shí)現(xiàn)聚合操作，在這篇文章里有主要介紹，感興趣的朋友請(qǐng)參考下文
2021-09-09
redis之django-redis的簡(jiǎn)單緩存使用
本篇文章介紹了redis之django-redis的簡(jiǎn)單緩存使用，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-06-06
用Python做一個(gè)簡(jiǎn)單的圖書(shū)管理系統(tǒng)
這篇文章主要介紹了用Python做一個(gè)簡(jiǎn)單的圖書(shū)管理系統(tǒng),有“還書(shū)““借閱”“添加書(shū)籍”等功能,文中提供了部分實(shí)現(xiàn)代碼和解決思路,有一定的參考價(jià)值,需要的朋友快來(lái)一起看看吧
2023-04-04
Python字符串模糊匹配工具TheFuzz的用法詳解
在處理文本數(shù)據(jù)時(shí),常常需要進(jìn)行模糊字符串匹配來(lái)找到相似的字符串,Python的TheFuzz庫(kù)提供了強(qiáng)大的方法用于解決這類(lèi)問(wèn)題,本文將深入介紹TheFuzz庫(kù),探討其基本概念、常用方法和示例代碼,需要的朋友可以參考下
2023-12-12
一文帶你了解Python與svg之間的操作
svgwrite是一個(gè)?Python?庫(kù)，用于生成簡(jiǎn)單的?SVG?圖片。它提供了一組類(lèi)似于繪圖的?API，使用者可以在?SVG?畫(huà)布上畫(huà)線、矩形、圓等圖形。本文主要介紹了如何利用svgwrite進(jìn)行SVG圖片的操作，需要的可以參考一下
2023-01-01
Python圖像處理之gif動(dòng)態(tài)圖的解析與合成操作詳解
這篇文章主要介紹了Python圖像處理之gif動(dòng)態(tài)圖的解析與合成操作,結(jié)合實(shí)例形式分析了Python基于PIL模塊解析gif文件,以及基于imageio庫(kù)合成gif文件的相關(guān)操作技巧,需要的朋友可以參考下
2018-12-12
關(guān)于Python3 類(lèi)方法、靜態(tài)方法新解
今天小編就為大家分享一篇關(guān)于Python3 類(lèi)方法、靜態(tài)方法新解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2019-08-08
PyG搭建GCN模型實(shí)現(xiàn)節(jié)點(diǎn)分類(lèi)GCNConv參數(shù)詳解
這篇文章主要為大家介紹了PyG搭建GCN模型實(shí)現(xiàn)節(jié)點(diǎn)分類(lèi)GCNConv參數(shù)詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-05-05