如何去除Google Bar Chart侧边文本的省略号？

要去除侧边分类文本后的省略号，核心是通过配置选项给标签留出足够显示空间或允许文本换行，具体修改如下：

修改代码添加配置选项 #

在drawBarChart函数中添加图表配置参数，调整垂直分类轴（vAxis）和图表区域的设置：

function drawBarChart(info, charId) {
    var view = new google.visualization.arrayToDataTable(info);
    // 添加图表配置选项
    var options = {
        // 垂直分类轴（侧边文本）设置
        vAxis: {
            maxTextLines: 3, // 设置文本最大显示行数，超出会自动换行，避免截断
            textStyle: {
                fontSize: 12 // 根据实际情况调整字号，缩小字号可减少截断概率
            },
            showTextEvery: 1 // 确保每个分类标签都完整显示
        },
        // 调整图表区域占比，给左侧标签留出足够空间
        chartArea: {
            width: '70%' // 图表主体占容器70%宽度，剩余30%留给左侧标签，可按需调整
        }
    };
    var chart = new google.visualization.BarChart(document.getElementById(charId));
    chart.draw(view, options); // 传入配置参数
}

额外优化方案 #

如果上述配置仍有截断，可尝试以下补充设置：

• 调整图表容器的CSS宽度，确保容器有足够的显示空间：

  #piechart_college {
      width: 800px; /* 或使用百分比，如width: 100%; */
  }
  

• 若标签包含特殊格式需求，可开启HTML支持，手动给长文本添加换行：
  1. 在配置中添加vAxis: { allowHtml: true }
  2. 修改数据生成部分，将长学院名用<br>拆分：

     temp.push(elem['college_name'].replace(' ', '<br>')); // 按空格拆分换行，可按需调整拆分规则
     

内容的提问来源于stack exchange，提问作者HuA