?一、實現效果圖:
?
二、具體代碼:
?
Ext.onReady(function(){
??? var data=[
????????????? {name:'張三',score:60},
????????????? {name:'李四', score:50},
????????????? {name:'王五',score:78}
?????????????? ];
??? var store=Ext.create('Ext.data.Store',{?
??????? fields:['name','score'],?
??????? autoLoad:true,?
??????? proxy:'memory',?
??????? data:data
??????? });
???? var chart3=Ext.create('Ext.chart.Chart',{
???????? renderTo:Ext.getBody(),
????????? animate:true,?
????????? store:store,?
????????? width:500,?
????????? height:300,?
????????? legend: {???????
??????????? position: 'top'? //定位
????????? },?
????????? series:[{??
??????????? legend: {?????
??????????? position: 'top'??
??????? },?
???????? type:'pie', //統計圖的類型
???????? highlight:{?
??????????? segment:{??
??????????????? margin:10? //扇區的margin
??????????? }
??????? },?
???????? field:'score',?? //根據score字段來分扇區的大小
???????? showInLegend: true,??
???????? label: {???
???????????? field: 'name',?? //扇區里顯示的字段
???????????? display: 'rotate',??
???????????? contrast: true,???
???????????? font: '20px Arial'??
??????? }?
??????? }]??
??? })?
??? });
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
