UPDATE

src/components/Pie3D.vue

 <template>
   <div>
-    3Dpie
+    <p>D3JS实现的3D饼图</p>
+    <div id="abc"></div>
   </div>
 </template>
 
-<script>
+<script setup>
+import pie from '../utils/pie'
+import { onMounted, reactive } from 'vue';
+
+let config = reactive({
+  
+})
+//基础数据
+const salesData = [
+    {label: "Basic", value: 100, color: "#0f7eee",show:true},
+    {label: "Plus", value: 20, color: "#24DAff",show:true},
+    {label: "Lite", value: 30, color: "#ffff80",show:true},
+    {label: "Elite", value: 40, color: "#caf982",show:true},
+    {label: "Delux", value: 50, color: "#80dcff",show:true},
+];
+onMounted(() => {
+  pie('#abc', 700, 400, salesData, 250, 200, 150, 100, 30, config)
+})
 
 </script>
 

src/utils/pie.js

+/**
+ * 生成3d饼图
+ * @param {*} id ：id唯一标识
+ * @param {*} width ：svg的宽
+ * @param {*} height ：svg的高
+ * @param {*} data ：要渲染的数据
+ * @param {*} x ：横向偏移量
+ * @param {*} y ：纵向偏移量
+ * @param {*} rx ：饼图的横向半径
+ * @param {*} ry ：饼图的纵向半径
+ * @param {*} h ：饼图的高度
+ */