<template>
	<div class="right_three">
    <CommonTitle title="建筑高度" />
		<div class="content" id="chartFour"  v-loading="isLoading"
         element-loading-background="rgba(0, 22, 52, 0.75)">
			
		</div>
	</div>
</template>

<script setup>
	import {
		ref,
		onMounted,
		nextTick
	} from 'vue'
	import {
		setEchartsNSolidBar
	} from '../echarts/option.js'
  import CommonTitle from "@/views/c-cpns/CommonTitle.vue";
  import {selectJzgdCount} from "@/service/http.js";
  const isLoading = ref(false);
	onMounted(() => {
    isLoading.value = true;
    selectJzgdCount().then(res =>{
      isLoading.value = false;
      let data = res.data.data.Rows;
      setEchartsNSolidBar(document.getElementById("chartFour"),data)
    });
	})
</script>

<style scoped lang="scss">
	.center {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	
	.center_center{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.right_three{
		height: 20%;
		padding-top: 10px;
		box-sizing: border-box;
		.content {
			height: 85%;
			width: 90%;
			margin: 0 20px;
			box-sizing: border-box;
			display: flex;
			flex-wrap: wrap;
			
			
		}
	}
</style>