317

src/views/echart/optimize_monitor.vue

@@ -385,9 +385,9 @@ const linechart = () => {
     legend: {
       data: vars.value,
       orient: "vertical", // 图例方向 (horizontal水平, vertical垂直)
-      right: '-8%',
+      right: '0%',
       top: '2%',
-      itemWidth: 40,  // 设置每个图例项的宽度
+      itemWidth: 30,  // 设置每个图例项的宽度
       itemHeight: 14,  // 设置每个图例项的高度
       // icon: "line",
       width: 'auto',
@@ -395,7 +395,16 @@ const linechart = () => {
       pageButtonItemGap: 10,  // 上下滚动按钮之间的间隔
       pageButtonPosition: 'end',  // 滚动按钮位置，'start'、'end'
       type: 'scroll',
-      
+      formatter: function (name) {
+        // 使用 ECharts 内部 API 获取文本宽度
+        var textWidth = echarts.format.getTextRect(name).width;
+
+        // 设置一个最大宽度（如 150px），如果文本宽度超出最大值则截断
+        if (textWidth > 150) {
+          return name.substring(0, 15) + '...';  // 超出最大宽度的部分加省略号
+        }
+        return name;  // 否则，直接返回原始文本
+      },
     },
     grid: {
       show: false,