|
@ -6,67 +6,11 @@
|
|
|
<div class="" style="height: 85%;">\
|
|
|
<div id="div-shiwang-echart" class="ml10"></div>\
|
|
|
<div class="div-siwang-type" v-if="causeData.length>0">\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="div-webkit-box" v-for="(cause, idx) in causeData">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-00e6f3 bar-a"></label>\
|
|
|
<label class="ml10">恶性肿瘤</label>\
|
|
|
<label class="ml20">{{causeData[0].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-ff616f bar-a"></label>\
|
|
|
<label class="ml10">心脏病</label>\
|
|
|
<label class="ml20">{{causeData[2].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-6576e0 bar-a"></label>\
|
|
|
<label class="ml10">损伤和中毒</label>\
|
|
|
<label class="ml20">{{causeData[4].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-03fa6c bar-a"></label>\
|
|
|
<label class="ml10">脑血管疾病</label>\
|
|
|
<label class="ml20">{{causeData[1].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-0fa5f2 bar-a"></label>\
|
|
|
<label class="ml10">呼吸系统疾病</label>\
|
|
|
<label class="ml20">{{causeData[3].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-da0ff2 bar-a"></label>\
|
|
|
<label class="ml10">消化系统疾病</label>\
|
|
|
<label class="ml20">{{causeData[5].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-f24a0f bar-a"></label>\
|
|
|
<label class="ml10">内分泌、营养和代谢疾病</label>\
|
|
|
<label class="ml20">{{causeData[6].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-ebff61 bar-a"></label>\
|
|
|
<label class="ml10">泌尿生殖系统疾病</label>\
|
|
|
<label class="ml20">{{causeData[7].value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-webkit-box">\
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">\
|
|
|
<label class="bgc-fea92f bar-a"></label>\
|
|
|
<label class="ml10">其他疾病</label>\
|
|
|
<label class="ml20">{{causeData[8].value}}</label>\
|
|
|
<label class="bar-a" v-bind:class="idx | formatData"></label>\
|
|
|
<label class="ml10">{{cause.name}}</label>\
|
|
|
<label class="ml20">{{cause.value}}</label>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
</div>\
|
|
@ -79,10 +23,7 @@
|
|
|
}
|
|
|
},
|
|
|
mounted: function() {
|
|
|
var vm = this;
|
|
|
setTimeout(function(){
|
|
|
vm.initData();
|
|
|
},50)
|
|
|
|
|
|
},
|
|
|
watch:{
|
|
|
data:function(data){
|
|
@ -90,27 +31,15 @@
|
|
|
this.initData();
|
|
|
}
|
|
|
},
|
|
|
filters:{
|
|
|
formatData:function(index){
|
|
|
var colorArr = ["bgc-00e6f3","bgc-03fa6c","bgc-ff616f","bgc-0fa5f2","bgc-6576e0","bgc-da0ff2","bgc-f24a0f","bgc-ebff61","bgc-fea92f"];
|
|
|
return colorArr[index];
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
formatCauseData:function(){
|
|
|
this.causeData = _.map(this.causeData,function(item,idx){
|
|
|
switch(idx){
|
|
|
case 0: item.color = "bgc-00e6f3"; break;
|
|
|
case 1: item.color = "bgc-03fa6c"; break;
|
|
|
case 2: item.color = "bgc-ff616f"; break;
|
|
|
case 3: item.color = "bgc-0fa5f2"; break;
|
|
|
case 4: item.color = "bgc-6576e0"; break;
|
|
|
case 5: item.color = "bgc-da0ff2"; break;
|
|
|
case 6: item.color = "bgc-f24a0f"; break;
|
|
|
case 7: item.color = "bgc-ebff61"; break;
|
|
|
case 8: item.color = "bgc-fea92f"; break;
|
|
|
default:break;
|
|
|
}
|
|
|
return item;
|
|
|
})
|
|
|
},
|
|
|
initData:function(){//死亡原因
|
|
|
this.causeData = this.data["死亡原因"].series[0].data;
|
|
|
this.formatCauseData();
|
|
|
var myChart = echarts.init(document.getElementById('div-shiwang-echart'));
|
|
|
var option = {
|
|
|
// "title": {
|