3d饼状图

index.html

@@ -22,6 +22,10 @@
     <link href="./static/Cesium/Widgets/widgets.css" rel="stylesheet">
     <!-- <link rel="stylesheet" href="//unpkg.com/view-design/dist/styles/iview.css"> -->
     <link rel="stylesheet" href="./static/css/iview/iview.css">
+    <!-- <script src="https://cdn.staticfile.net/echarts/5.4.0/echarts.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts-gl/2.0.8/echarts-gl.min.js" async></script> -->
+    <script src="./static/js/echarts.min.js"></script>
+    <script src="./static/js/echarts-gl.min.js"></script>
 
 </head>
 
@@ -35,9 +39,6 @@
     <script src="./static/js/vue.min.js"></script>
     <script src="./static/js/iview.min.js"></script>
     <!-- <script src="https://unpkg.com/axios/dist/axios.min.js" async></script> -->
-    <script src="./static/js/echarts.min.js" async></script>
-    <script src="./static/js/echarts-gl.min@2.0.8.js"></script>
-
 
 </body>
 

src/views/cockpitNew1/tdsc.vue

@@ -25,7 +25,7 @@
           <span>收储总面积</span>
           <span class="count2">213124.45</span>
           <span class="unit">公顷</span>
-      </div>
+        </div>
       </div>
       <div id="tdsc_echart">
 
@@ -260,6 +260,7 @@ export default {
       tdsc_my_chart.setOption(option);
     },
     initEchartXzqh() {
+
       var my_chart_xzqh = window.echarts.init(document.getElementById('tdsc_echart_xzqh'));
 
       // 生成扇形的曲面参数方程，用于 series-surface.parametricEquation
@@ -497,6 +498,8 @@ export default {
           itemHeight: 12, // 设置高度
           data: ['秸秆', '粪污', '厨余'],
           bottom: '5%',
+          right: '40%',
+
           itemGap: 10,
           textStyle: {
             color: '#fff',
@@ -510,7 +513,7 @@ export default {
         },
         animation: true,
 
-        backgroundColor: '#021041',
+        backgroundColor: 'rgba(0,0,0,0)',
         labelLine: {
           show: false,
           lineStyle: {
@@ -538,7 +541,8 @@ export default {
         grid3D: {
           show: false,
           boxHeight: 1,
-          top: '-10%',
+          top: '-5%',
+          left: '-25%',
           // bottom: '-80%',
           //					environment: '#021041',
           viewControl: {
@@ -553,14 +557,15 @@ export default {
         series: series,
       };
 
+
+
       my_chart_xzqh.setOption(option);
     },
   },
   mounted() {
-    const that = this;
     this.$nextTick((res) => {
-      // that.initEchart();
-      that.initEchartXzqh();
+      // this.initEchart();
+      this.initEchartXzqh();
     })
 
   },
@@ -661,7 +666,7 @@ export default {
   left: 1rem;
   top: 2rem;
   width: 32rem;
-  height: 11rem;
+  height: 13rem;
 }
 
 .icon_info {