博弈专题分析

src/views/overView/js/barChart.js

+import * as echarts from "echarts";
+const getColumnChart = (nameList, valueList, isPer) => {
+  const colorList = ['#0958D9', '#0958D9']
+  return {
+    tooltip: {},
+    grid: { top: '10%', right: '3%', bottom: '15%', left: '3%', containLabel: true },
+    color: colorList,
+    xAxis: {
+      type: 'category',
+      data: nameList,
+      axisLine: { show: false },
+      axisTick: { show: false },
+      axisLabel: {
+        show: true,
+        rotate: 45,                // ① 文字 45°
+        color: '#666',
+        fontSize: 12
+      }
+    },
+    yAxis: {
+      type: 'value',
+      axisLine: { show: false },
+      axisTick: { show: false },
+      axisLabel: { show: true, color: '#666' }, // ② Y 轴文字
+      splitLine: {                             // ③ 横向参考线
+        show: true,
+        lineStyle: { color: '#ebebeb', width: 1 }
+      }
+    },
+    series: [{
+      type: 'bar',
+      data: valueList.map((v, i) => ({
+        value: v,
+        label: { show: false, position: 'top', color: i < 3 ? colorList[0] : colorList[1] }
+      })),
+      barWidth: 16,
+      itemStyle: {
+        borderRadius: [8, 8, 0, 0],
+        color: params => {
+          const colors = params.dataIndex < 3
+            ? [colorList[0], 'rgba(255,255,255,0)']
+            : [colorList[1], 'rgba(255,255,255,0)']
+          return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+            { offset: 0, color: colors[0] },
+            { offset: 1, color: colors[1] }
+          ])
+        }
+      },
+      label: {
+        show: true,
+        position: 'top',
+        formatter: v => (isPer ? v.value + '%' : v.value)
+      }
+    }]
+  }
+}
+
+export default getColumnChart
\ No newline at end of file

src/views/overView/js/radarChart.js

+import * as echarts from "echarts";
+
+const getBarChart = (nameList, valueList, isPer) => {
+
+  const option = {
+    title: {
+      text: ""
+    },
+    // grid: {
+    // 	top: 100
+    // },
+    legend: {
+      top: 0,
+      icon: "circle",
+      data: ["能源", "集成电路", "人工智能", '通信网络', '量子科技', '生物科技']
+    },
+    radar: {
+      // shape: 'circle',
+      indicator: [
+        { name: "能源", max: 6500 },
+        { name: "集成电路", max: 16000 },
+        { name: "人工智能", max: 30000 },
+        { name: "通信网络", max: 38000 },
+        { name: "量子科技", max: 52000 },
+        { name: "生物科技", max: 25000 }
+      ],
+      axisName: {
+        formatter: "{value}",
+        color: "rgba(59, 65, 75, 1)",
+        fontSize: 16,
+        fontWeight: 700
+      }
+    },
+    series: [
+      {
+        name: "Budget vs spending",
+        type: "radar",
+        data: [
+          {
+            value: [4200, 3000, 20000, 35000, 50000, 18000],
+            name: "法案",
+            areaStyle: {
+              color: "rgba(10, 87, 166, 0.2)"
+            }
+          },
+          {
+            value: [5000, 14000, 28000, 26000, 42000, 21000],
+            name: "行政令",
+            areaStyle: {
+              color: "rgba(206, 79, 81, 0.2)"
+            }
+          },
+          {
+            value: [4000, 14000, 18000, 21000, 32000, 10000],
+            name: "科技智库",
+            areaStyle: {
+              color: "rgba(250, 140, 22, 0.2)"
+            }
+          },
+          {
+            value: [4000, 14000, 18000, 21000, 32000, 10000],
+            name: "出口管制",
+            areaStyle: {
+              color: "rgba(250, 140, 22, 0.2)"
+            }
+          },
+          {
+            value: [4000, 14000, 18000, 21000, 32000, 10000],
+            name: "投融资限制",
+            areaStyle: {
+              color: "rgba(250, 140, 22, 0.2)"
+            }
+          },
+          {
+            value: [4000, 14000, 18000, 21000, 32000, 10000],
+            name: "市场准入",
+            areaStyle: {
+              color: "rgba(250, 140, 22, 0.2)"
+            }
+          }
+        ]
+      }
+    ]
+  }
+  return option
+}
+
+export default getBarChart
\ No newline at end of file