效果图
具体实现:
先引入js文件
<script src="js/echarts.min.js"></script>
var province=new Array();
for( var i=0;i<34;i++){
province[i]=new Array();
province[i][1] = 0;
province[i][2] = 0;
}
province[0][0]=11;province[1][0]=12;province[2][0]=13;province[3][0]=14;province[4][0]=15;
province[5][0]=21;province[6][0]=22;province[7][0]=23;province[8][0]=31;province[9][0]=32;
province[10][0]=33;province[11][0]=34;province[12][0]=35;province[13][0]=36;province[14][0]=37;
province[15][0]=41;province[16][0]=42;province[17][0]=43;province[18][0]=44;province[19][0]=45;
province[20][0]=46;province[21][0]=50;province[22][0]=51;province[23][0]=52;province[24][0]=53;
province[25][0]=54;province[26][0]=61;province[27][0]=62;province[28][0]=63;province[29][0]=64;
province[30][0]=65;province[31][0]=71;province[32][0]=81;province[33][0]=82;
province[0][3]='北京市'; province[1][3]='天津市'; province[2][3]='河北省'; province[3][3]='山西省'; province[4][3]='内蒙古自治区';
province[5][3]='辽宁省'; province[6][3]='吉林省'; province[7][3]='黑龙江省'; province[8][3]='上海市'; province[9][3]='江苏省';
province[10][3]='浙江省'; province[11][3]='安徽省'; province[12][3]='福建省'; province[13][3]='江西省'; province[14][3]='山东省';
province[15][3]='河南省'; province[16][3]='湖北省'; province[17][3]='湖南省'; province[18][3]='广东省'; province[19][3]='广西壮族自治区';
province[20][3]='海南省'; province[21][3]='重庆市'; province[22][3]='四川省'; province[23][3]='贵州省'; province[24][3]='云南省';
province[25][3]='西藏自治区'; province[26][3]='陕西省'; province[27][3]='甘肃省'; province[28][3]='青海省'; province[29][3]='宁夏回族自治区';
province[30][3]='新疆维吾尔自治区'; province[31][3]='台湾省'; province[32][3]='香港特别行政区'; province[33][3]='澳门特别行政区';
function findSendCount(){
$.ajax({
url: "http://IP地址:8080/项目名/REST/Domain/getExpressList",
type: "get",
dataType: "json",
async:false,
success: function(data){
setCount(data);
},
error: function(msg){
alert("ajax连接异常");
}
});
}
function setCount(data){
var i;
var j;
for(i=0;i<data.length;i++){
sendstr=data[i].sender.regionCode.toString();
receivestr=data[i].recever.regionCode.toString();
for(j=0;j<34;j++){
if(province[j][0]==sendstr.slice(0,2)){
province[j][1]++;
//alert(j+"+++");
}
if(province[j][0]==receivestr.slice(0,2)){
province[j][2]++;
}
}
}
addData();
}
function addData(){
var a=0;var b=0;
for(i=0;i<34;i++){
if(province[i][1]!=0){
var value=province[i][1];
var name=province[i][3];
value1[a++]={value: value,name:name};
}
if(province[i][2]!=0){
value2[b++]={value: province[i][2],name:province[i][3]};
//alert(value2[b-1].name+"+"+value2[b-1].value);
}
}
show();
}
function show(){
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
title: {
text: '地区寄件收件统计',
subtext: '以省为单位',
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
series: [
{
name: '地区寄件统计',
type: 'pie',
radius: [20, 110],
center: ['25%', '50%'],
roseType: 'radius',
label: {
show: false
},
emphasis: {
label: {
show: true
}
},
data: value1
},
{
name: '地区收件统计',
type: 'pie',
radius: [30, 110],
center: ['75%', '50%'],
roseType: 'area',
label: {
show: false
},
emphasis: {
label: {
show: true
}
},
data: value2
}
]
};
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
}