瀏覽代碼

Merge remote-tracking branch 'origin/visu_farming_0_1' into visu_farming_0_1

wang_xy 2 年之前
父節點
當前提交
8a29022bf6
共有 4 個文件被更改,包括 143 次插入3 次删除
  1. 8 0
      src/api/bigdata/bigdata.js
  2. 25 2
      src/views/bigdata/bigdata.vue
  3. 108 0
      src/views/bigdata/chart-agricultureData.vue
  4. 2 1
      src/views/datacenter.vue

+ 8 - 0
src/api/bigdata/bigdata.js

@@ -98,6 +98,14 @@ export function getLItianDept() {
   })
 }
 
+// 农业数据统计--饼图
+export function getAgricultureData() {
+  return request({
+    url: '/center-agriculture/data/getAgricultureData',
+    method: 'get',
+  })
+}
+
 //热力图
 export function getRlt(param) {
   //暂时传当年,以后再说

+ 25 - 2
src/views/bigdata/bigdata.vue

@@ -152,6 +152,21 @@
           <chartCollectionTwo ref="chartCollectionTwo"></chartCollectionTwo>
         </div>
       </div>
+      <!-- 第七纵向-->
+      <!--<div class="bigdata-list wid-li-1 m-l-15">-->
+        <!--&lt;!&ndash;<div class="b-con mg-b-20 tall">&ndash;&gt;-->
+          <!--&lt;!&ndash;<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">&ndash;&gt;-->
+            <!--&lt;!&ndash;<span>还田分布、类型统计</span>&ndash;&gt;-->
+          <!--&lt;!&ndash;</div>&ndash;&gt;-->
+          <!--&lt;!&ndash;<chartDetector ref=""></chartDetector>&ndash;&gt;-->
+        <!--&lt;!&ndash;</div>&ndash;&gt;-->
+        <!--<div class="b-con">-->
+          <!--<div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">-->
+            <!--<span>农业数据统计</span>-->
+          <!--</div>-->
+          <!--<chartAgricultureData ref="chartAgricultureData"></chartAgricultureData>-->
+        <!--</div>-->
+      <!--</div>-->
     </div>
   </div>
 </template>
@@ -183,6 +198,7 @@ import chartPlant from './chart-plant' //19 种植
 import chartBreed from './chart-breed' //20 养殖
 import chartFireControlTwo from './chart-firecontrolTwo' //21 病虫害分布
 import chartCollectionTwo from './chart-collectionTwo' //22 粪污处理分布
+import chartAgricultureData from './chart-agricultureData' //23 农业数据统计
 
 import bigdataSupermap from '@/components/supermap' //超图
 
@@ -192,7 +208,7 @@ import {
   , leidaBigData, protectInfoBigData, xubaoBigData
   , zhongZiBigData, huaFeiBigData, YangZhiBigData
   , getHuanTianDept, getHuanTianType, getLItianDept
-  , plantDataAnalysis, breedDataAnalysis
+  , getAgricultureData, plantDataAnalysis, breedDataAnalysis
 } from '@/api/bigdata/bigdata'
 import { fontConfig } from '@/api/login'
 
@@ -222,7 +238,8 @@ export default {
     chartPlant,
     chartBreed,
     chartFireControlTwo,
-    chartCollectionTwo
+    chartCollectionTwo,
+    chartAgricultureData,
   },
   created() {
     this.fontConfig()
@@ -244,6 +261,7 @@ export default {
     this.breedDataAnalysis()
     this.findEventGroupByDept()
     this.findPerByEventXl()
+    // this.getAgricultureData();
   },
   mounted() {
     // setTimeout(() => {
@@ -428,6 +446,11 @@ export default {
         this.$refs.chartWaterIntake.myEcharts(res.data)
       })
     },
+    getAgricultureData() {
+      getAgricultureData().then(res => {
+        this.$refs.chartAgricultureData.myEcharts(res.data)
+      })
+    },
     plantDataAnalysis() {
       plantDataAnalysis().then(res => {
         for (let i in res.data.series) {

+ 108 - 0
src/views/bigdata/chart-agricultureData.vue

@@ -0,0 +1,108 @@
+<!-- **************************************NO.23 农业数据统计*************************************** -->
+<template>
+	<div class="chart-container">
+		<div id="agricultureData" style="width: 100%; height:23vh;">
+		</div>
+	</div>
+</template>
+
+<script>
+	import * as echarts from 'echarts';
+	export default {
+		name: 'agricultureData',
+		data() {
+			return {
+				count: 0
+			}
+		},
+		mounted() {
+			// this.myEcharts()
+		},
+
+		methods: {
+			// 出处 http://192.144.199.210:8080/editor/index.html?chart_id=UDNqxg4NZdRORp80
+			myEcharts(data) {
+				var chartDom = document.getElementById('agricultureData');
+				var myChart = echarts.init(chartDom);
+				var color = ['#0E7CE2', '#FF8352', '#E271DE', '#F8456B', '#00FFFF', '#4AEAB0'];
+				var option;
+				let bgColor = '#fff';
+
+				let formatNumber = function (num) {
+				    let reg = /(?=(\B)(\d{3})+$)/g;
+				    return num.toString().replace(reg, ',');
+				};
+
+				option = {
+				    color: color,
+				    series: [
+				        {
+				            type: 'pie',
+				            radius: ['50%', '70%'],
+				            center: ['50%', '50%'],
+				            data: data,
+				            hoverAnimation: false,
+				            itemStyle: {
+				                normal: {
+				                    borderWidth:1,
+				                },
+
+				                emphasis: {
+				                    borderColor: bgColor,
+				                    borderWidth: 2,
+				                         shadowBlur: 8,
+				                borderColor: "#00ffff",
+				                shadowColor: "#00ffff",
+				                },
+				            },
+				            labelLine: {
+				                normal: {
+				                    length: 20,
+				                    length2:10,
+				                    lineStyle: {
+				                        color: '#356781',
+				                    },
+				                },
+				            },
+				            label: {
+				                normal: {
+				                    formatter: (params) => {
+				                        return '{icon|●}{name|' + params.name + '}{value|' + formatNumber(params.value) + '}';
+				                    },
+				                    rich: {
+				                        icon: {
+				                            fontSize: 10,
+				                        },
+				                        name: {
+				                            fontSize:10,
+				                            padding: [0, 3, 0, 4],
+				                            color: '#23c9ea',
+				                        },
+				                        value: {
+				                            fontSize: 10,
+				                            color: '#ffffff',
+				                        },
+				                    },
+				                },
+				            },
+				        },
+				    ],
+				};
+				option && myChart.setOption(option);
+			},
+
+		},
+
+
+	}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+	.chart-container {
+		width: 100%;
+		height: auto;
+		position: relative;
+		padding-bottom: 10px;
+		display: flex;
+	}
+</style>

+ 2 - 1
src/views/datacenter.vue

@@ -391,8 +391,9 @@ export default {
             key == 'getSupervise' ||
             key == 'grainFourSeasons'
           ){
-            that.resourcesList.push(map);
+            // that.resourcesList.push(map);
           }
+          that.resourcesList.push(map);
         }
       })
     },