xiabin
This commit is contained in:
		
							parent
							
								
									b741c624f2
								
							
						
					
					
						commit
						0c90f9cf1c
					
				| @ -1,6 +1,7 @@ | ||||
| <template> | ||||
|   <div class="custom-page" :style="`background-image: url(${getAssetsFile('images/landBase/land2.png')})`"> | ||||
|     <!-- <div class="custom-page"> | ||||
|   <!-- <div class="custom-page" :style="`background-image: url(${getAssetsFile('images/landBase/land2.png')})`"> --> | ||||
|   <div class="custom-page"> | ||||
|     <!-- <div class="custom-page"> --> | ||||
|     <div class="content"> | ||||
|       <div style="display: flex"> | ||||
|         <pieChart v-for="(item, index) in data" :key="index" class="m-left" :refs="item.refs" :title="item.title" :data="item.data" /> | ||||
| @ -8,7 +9,7 @@ | ||||
|       <div style="display: flex; margin-top: 20px"> | ||||
|         <pieChart v-for="(item, index) in data1" :key="index" class="m-left" :refs="item.refs" :title="item.title" :data="item.data" /> | ||||
|       </div> | ||||
|     </div> --> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| @ -19,21 +20,113 @@ import { ref, onBeforeMount, reactive } from 'vue'; | ||||
| import 'echarts-gl'; | ||||
| import pieChart from './components/pie-chart.vue'; | ||||
| import { ElMessage, ElMessageBox } from 'element-plus'; | ||||
| import { color } from 'echarts'; | ||||
| let dataColor0 = ['#01D3D3', '#00C4F2', '#4A68FF', '#00DD97', '#01D3D3', '#00C4F2', '#4A68FF', '#00DD97']; | ||||
| let data = ref([ | ||||
|   { | ||||
|     title: '农用地面积数据', | ||||
|     data: [], | ||||
|     data: [ | ||||
|       { | ||||
|         name: '耕地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#01D3D3', | ||||
|         }, | ||||
|         value: '45.60', | ||||
|       }, | ||||
|       { | ||||
|         name: '园地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00C4F2', | ||||
|         }, | ||||
|         value: '28.49', | ||||
|       }, | ||||
|       { | ||||
|         name: '草地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#4A68FF', | ||||
|         }, | ||||
|         value: '16.30', | ||||
|       }, | ||||
|       { | ||||
|         name: '林地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00DD97', | ||||
|         }, | ||||
|         value: '17.71', | ||||
|       }, | ||||
|     ], | ||||
|     refs: 'chart1', | ||||
|   }, | ||||
|   { | ||||
|     title: '土地流转面积数据', | ||||
|     data: [], | ||||
|     data: [ | ||||
|       { | ||||
|         name: '耕地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#01D3D3', | ||||
|         }, | ||||
|         value: '3.63', | ||||
|       }, | ||||
|       { | ||||
|         name: '园地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00C4F2', | ||||
|         }, | ||||
|         value: '2.65', | ||||
|       }, | ||||
|       { | ||||
|         name: '草地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#4A68FF', | ||||
|         }, | ||||
|         value: '2.14', | ||||
|       }, | ||||
|       { | ||||
|         name: '林地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00DD97', | ||||
|         }, | ||||
|         value: '1.65', | ||||
|       }, | ||||
|     ], | ||||
|     refs: 'chart1', | ||||
|   }, | ||||
|   { | ||||
|     title: '耕地面积数据', | ||||
|     data: [], | ||||
|     data: [ | ||||
|       { | ||||
|         name: '水浇地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#01D3D3', | ||||
|         }, | ||||
|         value: '20.72', | ||||
|       }, | ||||
|       { | ||||
|         name: '水田', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00C4F2', | ||||
|         }, | ||||
|         value: '28.49', | ||||
|       }, | ||||
|       { | ||||
|         name: '旱地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#4A68FF', | ||||
|         }, | ||||
|         value: '16.30', | ||||
|       }, | ||||
|     ], | ||||
|     refs: 'chart1', | ||||
|   }, | ||||
| ]); | ||||
| @ -41,17 +134,68 @@ let data = ref([ | ||||
| let data1 = ref([ | ||||
|   { | ||||
|     title: '园地面积数据', | ||||
|     data: [], | ||||
|     data: [ | ||||
|       { | ||||
|         name: '果园', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#01D3D3', | ||||
|         }, | ||||
|         value: '15.44', | ||||
|       }, | ||||
|       { | ||||
|         name: '茶园', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00C4F2', | ||||
|         }, | ||||
|         value: '13.01', | ||||
|       }, | ||||
|     ], | ||||
|     refs: 'chart1', | ||||
|   }, | ||||
|   { | ||||
|     title: '林地面积数据', | ||||
|     data: [], | ||||
|     data: [ | ||||
|       { | ||||
|         name: '灌木从地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#01D3D3', | ||||
|         }, | ||||
|         value: '7.49', | ||||
|       }, | ||||
|       { | ||||
|         name: '竹林地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00C4F2', | ||||
|         }, | ||||
|         value: '8.80', | ||||
|       }, | ||||
|     ], | ||||
|     refs: 'chart1', | ||||
|   }, | ||||
|   { | ||||
|     title: '草地面积数据', | ||||
|     data: [], | ||||
|     data: [ | ||||
|       { | ||||
|         name: '人工牧草地', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#01D3D3', | ||||
|         }, | ||||
|         value: '10.71', | ||||
|       }, | ||||
|       { | ||||
|         name: '其他', | ||||
|         itemStyle: { | ||||
|           opacity: 0.9, | ||||
|           color: '#00C4F2', | ||||
|         }, | ||||
|         value: '1.71', | ||||
|       }, | ||||
|     ], | ||||
|     refs: 'chart1', | ||||
|   }, | ||||
| ]); | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user