|
@@ -36,6 +36,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="tk_zs">
|
|
|
+ <div class="tk_zs_tit"><span>归集数据总量</span><u>0000000000</u></div>
|
|
|
<div class="d_bg"><img th:src="@{/visualization/images/thqzj_tk5.png}"/></div>
|
|
|
<div class="s_bg"><img th:src="@{/visualization/images/thqzj_tk6.png}"/></div>
|
|
|
<div class="b_yp"><img th:src="@{/visualization/images/thqzj_tk15.png}"/></div>
|
|
@@ -107,6 +108,7 @@
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div id="gjsj_bt"></div>
|
|
|
<div id="gjsj2"></div>
|
|
|
</div>
|
|
|
<div class="tk_bottom2 tk_bg fl">
|
|
@@ -124,6 +126,8 @@
|
|
|
getJkspfx();
|
|
|
//月度申请数量分析
|
|
|
getYdsqsl();
|
|
|
+ //接口申请数量月度统计-饼图
|
|
|
+ ydsqsl_bt();
|
|
|
})
|
|
|
|
|
|
/**接口占比**/
|
|
@@ -662,6 +666,91 @@
|
|
|
myChart.setOption(option);
|
|
|
}
|
|
|
}
|
|
|
+ /**月度申请数量统计 饼图**/
|
|
|
+ function ydsqsl_bt() {
|
|
|
+ var chartPie1 = echarts.init(document.getElementById('gjsj_bt'));
|
|
|
+ function getEhartsOption(data) {
|
|
|
+ var option;
|
|
|
+ return option ={
|
|
|
+ color:["#FFD600", "#00A2FF","#6924FE","#CA44FB","#6B61FF"],
|
|
|
+ title : {
|
|
|
+ text: data.title,
|
|
|
+ subtext: data.subtext,
|
|
|
+ x:'center',
|
|
|
+ y: '70%',
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 16,
|
|
|
+ color: '#fff' // 主标题文字颜色
|
|
|
+ },
|
|
|
+ subtextStyle: {
|
|
|
+ fontSize: 20,
|
|
|
+ color: '#FFD600' // 副标题文字颜色
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name:'',
|
|
|
+ type:'pie',
|
|
|
+ center: ['50%', '40%'],
|
|
|
+ radius: ["50%", "60%"],
|
|
|
+ avoidLabelOverlap: false,
|
|
|
+ label: {
|
|
|
+ normal: {
|
|
|
+ show: false,
|
|
|
+ position: 'center'
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ show: true,
|
|
|
+ formatter:function(params, ticket, callback) {
|
|
|
+ var name = params.data.name;
|
|
|
+ var arr = name.split(":");
|
|
|
+ var percent = params.percent;
|
|
|
+ var str = percent+'%'+'\n'+ arr[0];
|
|
|
+ return str;
|
|
|
+ },
|
|
|
+ textStyle: {
|
|
|
+ fontSize: '15',
|
|
|
+ fontWeight: 'bold' ,
|
|
|
+ color:'#fff'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ labelLine: {
|
|
|
+ normal: {
|
|
|
+ show: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data:data.data
|
|
|
+ }
|
|
|
+ ]}
|
|
|
+ }
|
|
|
+ var parame1 ={
|
|
|
+ title:"家庭活跃人数",
|
|
|
+ subtext:"303100人",
|
|
|
+ data: [
|
|
|
+ { value: 38, name: '61岁以上' },
|
|
|
+ { value: 7, name: '30岁以下' },
|
|
|
+ { value: 20, name: '30-40岁' },
|
|
|
+ { value: 16, name: '51-60岁' },
|
|
|
+ { value: 19, name: '41-50岁' }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ chartPie1.setOption(getEhartsOption(parame1));
|
|
|
+ var i=0;
|
|
|
+ chartPie1.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex: i});//设置默认选中高亮部分
|
|
|
+ setInterval(function(){
|
|
|
+ i++;
|
|
|
+ if(i == 5){
|
|
|
+ i=0
|
|
|
+ }
|
|
|
+ chartPie1.dispatchAction({
|
|
|
+ type: 'downplay',
|
|
|
+ seriesIndex: 0,
|
|
|
+ dataIndex: i==0?4:i-1,
|
|
|
+ });
|
|
|
+ chartPie1.dispatchAction({type: 'highlight',seriesIndex: 0,dataIndex:i==5?0:i});//设置默认选中高亮部分
|
|
|
+ },1000);
|
|
|
+ }
|
|
|
</script>
|
|
|
<script>
|
|
|
(function ($) {
|