up

src/pages/Abench/A1statistics/index.tsx

@@ -5,30 +5,26 @@ import { iconUrl } from '@/utils/http'
 import * as echarts from 'echarts'
 
 const chartData1 = [
-  { name: '啤酒产品类', value: 2500, percentage: '10%' },
-  { name: '饮用器皿类', value: 1800, percentage: '5%' },
-  { name: '品牌文化与节庆类', value: 1200, percentage: '2%' },
-  { name: '企业文化与档案类', value: 800, percentage: '3%' },
-  { name: '艺术与礼品类', value: 1000, percentage: '10%' },
-  { name: '工具与设备类', value: 900, percentage: '5%' },
-  { name: '其他综合类', value: 2500, percentage: '10%' }
+  { name: '啤酒产品类', value: 2500 },
+  { name: '饮用器皿类', value: 1800 },
+  { name: '品牌文化与节庆类', value: 1200 },
+  { name: '企业文化与档案类', value: 800 },
+  { name: '艺术与礼品类', value: 1000 },
+  { name: '工具与设备类', value: 900 },
+  { name: '其他综合类', value: 2500 }
 ]
 
 const chartData2 = [
-  { name: '酒类实物', value: 2500, percentage: '10%' },
-  { name: '包装与标识', value: 1800, percentage: '8%' },
-  { name: '杯子', value: 1200, percentage: '6%' },
-  { name: '品牌节庆活动', value: 1800, percentage: '8%' },
-  { name: '品牌视觉传播', value: 1800, percentage: '8%' },
-  { name: '文书档案', value: 1800, percentage: '8%' },
-  { name: '影像资料', value: 1800, percentage: '8%' },
-  { name: '荣誉与表彰', value: 1800, percentage: '8%' },
-  { name: '企业藏品', value: 1800, percentage: '8%' },
-  { name: '艺术藏品', value: 1800, percentage: '8%' },
-  { name: '纪念礼品', value: 1800, percentage: '8%' },
-  { name: '酿造与开启工具', value: 1800, percentage: '8%' },
-  { name: '设备模型或实物', value: 1800, percentage: '8%' },
-  { name: '其他', value: 1800, percentage: '6%' }
+  { name: '酒类实物', value: 2500 },
+  { name: '包装与标识', value: 1800 },
+  { name: '杯子', value: 1200 },
+  { name: '品牌节庆活动', value: 1300 },
+  { name: '品牌视觉传播', value: 1600 },
+  { name: '文书档案', value: 1700 },
+  { name: '影像资料', value: 2200 },
+  { name: '荣誉与表彰', value: 1800 },
+  { name: '企业藏品', value: 1800 },
+  { name: '其他', value: 1900 }
 ]
 
 const DEFAULT_COLORS = ['#c11b2d', '#243220', '#24664b', '#8acfb2', '#806e4c', '#988364', '#972d00']
@@ -92,6 +88,9 @@ function A1statistics() {
   // 生成柱状图
   const initEchFu = useCallback((data: any[], dom: any) => {
     if (!dom) return
+
+    // 计算总数用于百分比
+    const total = data.reduce((sum, item) => sum + item.value, 0)
     const myChart = echarts.getInstanceByDom(dom) || echarts.init(dom)
 
     const option: echarts.EChartsOption = {
@@ -105,7 +104,7 @@ function A1statistics() {
           return `
                   <div style="font-weight: bold;">${param.name}</div>
                   <div>数量: ${param.value}</div>
-                  <div>占比: ${param.data.percentage}</div>
+                  <div>占比: ${((param.value / total) * 100).toFixed(1) + '%'}</div>
                 `
         },
         backgroundColor: 'rgba(255, 255, 255, 0.95)',
@@ -181,7 +180,7 @@ function A1statistics() {
           type: 'bar',
           data: data.map((item, index) => ({
             value: item.value,
-            percentage: item.percentage,
+            percentage: ((item.value / total) * 100).toFixed(1) + '%',
             // 为每个柱子设置独立的渐变
             itemStyle: {
               // 关键修改：使用线性渐变实现单个柱子的渐变效果
@@ -209,7 +208,7 @@ function A1statistics() {
             position: 'top',
             formatter: (params: any) => {
               const itemData = params.data
-              return `${itemData.value}\n${itemData.percentage}`
+              return `${itemData.value}\n${((itemData.value / total) * 100).toFixed(1) + '%'}`
             },
             fontSize: 10,
             fontWeight: 'bold',