syyang před 2 roky
rodič
revize
ef1968c526

+ 46 - 1
mybusiness/src/main/resources/static/visualization/css/th_yj.css

@@ -141,6 +141,15 @@ body::-webkit-scrollbar {
 	background: rgba(0, 4, 64, 0.85);
 	color: #00ffea;
 }
+.header_nav .nav_a i span,.header_nav .nav_a i{
+color: #e22020!important;
+	font-weight: 900;
+}
+.header_nav .nav_la i span,.header_nav .nav_la i{
+	color: #00ffea!important;
+	font-weight: 900;
+}
+
 .nav_div{
 	display: none;
 }
@@ -1228,8 +1237,14 @@ body::-webkit-scrollbar {
 	margin-right: 20px;
 }
 #gjsj2{
-	width: 1090px;
+	width: 790px;
 	height: 280px;
+	float: left;
+}
+#gjsj_bt{
+	width: 300px;
+	height: 280px;
+	float: left;
 }
 .tk_bottom2{
 	width: 487px;
@@ -1264,3 +1279,33 @@ appearance:none;
 	border: 0px;
 	outline: 0px;
 }
+
+
+.tk_zs_tit{
+	height: 40px;
+	line-height: 40px;
+	text-align: center;
+	width: 100%;
+}
+.tk_zs_tit span{
+	font-size: 24px;
+	font-weight: bold;
+	background-image:-webkit-linear-gradient(bottom,#59c8ff,#fafeff);
+	-webkit-background-clip:text;
+	-webkit-text-fill-color:transparent;
+	padding-right: 10px;
+}
+.tk_zs_tit u{
+	background: url(../images/th_gjsjzl.png);
+	text-indent: 12px;
+	display: inline-block;
+	color: #fff;
+	font-weight: 900;
+	height: 40px;
+	letter-spacing: 23.2px;
+	line-height: 40px;
+	font-size: 32px;
+	font-family: electronicFont;
+	text-decoration: none;
+	max-width: 380px;
+}

binární
mybusiness/src/main/resources/static/visualization/images/th_gjsjzl.png


+ 1 - 1
mybusiness/src/main/resources/templates/visualization/index.html

@@ -22,7 +22,7 @@
     <div class="header_nav fr">
         <a class="nav_a on">大数据</a>
         <div class="nav_a nav_la">
-            <span>接入部门</span>
+            <span>接入部门<i>(<span>33</span>)</i></span>
             <div class="nav_div">
                 <a th:each="dept:${depts}" th:id="${dept.deptId}">[[${dept.deptName}]]</a>
             </div>

+ 89 - 0
mybusiness/src/main/resources/templates/visualization/tk_iframe.html

@@ -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 ($) {