图表

.gitignore

@@ -0,0 +1,17 @@
+# Mac
+.DS_Store
+**/.DS_Store
+
+# vim/vi
+*.swp
+
+# JavaScript
+node_modules/
+unpackage
+.node_modules/
+.eslintcache
+unpackage/dist/build/
+unpackage/dist/dev/
+
+# python
+*.pyc

package-lock.json

@@ -0,0 +1,34 @@
+{
+  "name": "12123",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "dependencies": {
+        "echarts": "^5.5.0"
+      }
+    },
+    "node_modules/echarts": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/echarts/-/echarts-5.5.0.tgz",
+      "integrity": "sha512-rNYnNCzqDAPCr4m/fqyUFv7fD9qIsd50S6GDFgO1DxZhncCsNsG7IfUlAlvZe5oSEQxtsjnHiUuppzccry93Xw==",
+      "dependencies": {
+        "tslib": "2.3.0",
+        "zrender": "5.5.0"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
+    },
+    "node_modules/zrender": {
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/zrender/-/zrender-5.5.0.tgz",
+      "integrity": "sha512-O3MilSi/9mwoovx77m6ROZM7sXShR/O/JIanvzTwjN3FORfLSr81PsUGd7jlaYOeds9d8tw82oP44+3YucVo+w==",
+      "dependencies": {
+        "tslib": "2.3.0"
+      }
+    }
+  }
+}

package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "echarts": "^5.5.0"
+  }
+}

pages/my/index.vue

@@ -1,8 +1,87 @@
 <template>
+  <view style="width: 200px; min-height: 200px">111</view>
+  <view style="height: 300px; width: 200px; background-color: aqua">
+    <view id="lineChartRef" :style="{ width: '200px', height: '200px' }" />
+  </view>
 </template>
 
-<script>
+<script setup>
+import { ref, onMounted } from 'vue';
+import * as echarts from 'echarts';
+
+const option = {
+  series: [
+    {
+      type: 'gauge',
+      min: 0, // 最小刻度
+      max: 12,
+      radius: '35%',
+      progress: {
+        show: true,
+        width: 18,
+        roundCap: true,
+        itemStyle: {
+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+            {
+              offset: 0,
+              color: '#A65FFB'
+            },
+            {
+              offset: 1,
+              color: '#3163F5'
+            }
+          ])
+        }
+      },
+      axisLine: {
+        lineStyle: {
+          width: 18
+        },
+        roundCap: true
+      },
+      axisTick: {
+        show: false
+      },
+      splitLine: {
+        show: false
+      },
+      pointer: {
+        show: false
+      },
+      axisLabel: {
+        show: false
+      },
+      anchor: {
+        show: false
+      },
+      title: {
+        offsetCenter: [0, '-30%'],
+        fontSize: 20
+      },
+      detail: {
+        valueAnimation: true,
+        formatter: '{value} 分\n正常',
+        color: 'inherit'
+      },
+      data: [
+        {
+          value: 1,
+          name: '累计积分'
+        }
+      ]
+    }
+  ]
+};
+
+// 在组件挂载后初始化ECharts实例并设置选项
+onMounted(() => {
+  // const lineChartContainer = lineChartRef.value;
+  const lineChartContainer = document.getElementById('lineChartRef');
+  if (lineChartContainer) {
+    const myChart = echarts.init(lineChartContainer);
+    myChart.setOption(option);
+  }
+});
 </script>
 
-<style>
+<style></style>
-</style>

unpackage/dist/cache/.vite/deps/_metadata.json

@@ -1,8 +1,15 @@
 {
-  "hash": "1be28527",
+  "hash": "5decd256",
   "configHash": "046e9b57",
-  "lockfileHash": "e3b0c442",
+  "lockfileHash": "75bcaea7",
-  "browserHash": "3301d69a",
+  "browserHash": "7bd57346",
-  "optimized": {},
+  "optimized": {
+    "echarts": {
+      "src": "../../../../../node_modules/echarts/index.js",
+      "file": "echarts.js",
+      "fileHash": "e54ff7d3",
+      "needsInterop": false
+    }
+  },
   "chunks": {}
 }