echarts处理x轴的文字过长,换行显示

css 复制代码
xAxis: {
   type: "category",       
   boundaryGap: false,               
   data: interfaceName,          
   axisLabel: {  //坐标轴刻度标签的相关设置。               
      interval: 0,                 
      margin: 12,                                       
      textStyle: {   // 更改x轴文字颜色的配置 
          color: "#99B4D9", //处理x轴的文字颜色           
          fontSize: 12,         
      },              
      formatter: function (value) {              
          let result = "";           
          let maxLength = 4; // 每行最多显示4个字符                 
          for ( let i = 0, len = value.length;  i < len; i += maxLength ) {                    
                result += value.slice(i, i + maxLength) + "\n"; 
          }              
          return result;  
      },  
   },                
   axisLine: {                
      lineStyle: {               
        color: "#199DFF",               
        width: 1, //x轴线的宽度         
      },             
    },               
   axisTick: {                 
      show: false,     
   }, 
},
相关推荐
Tongsr15 分钟前
别只混淆代码:用 Kaleido 加固整个 Android Release AAB
前端·算法·github
郭邯20 分钟前
从零到一:我用 AI 写了一个贷款计算器,顺便把等额本息公式彻底搞懂了
前端
汉堡大王952724 分钟前
面试官:讲讲归并排序 —— 为什么它能在面试里反复出现?
前端·javascript·面试
kyriewen31 分钟前
别再只给人写页面了:AI 已经开始自己点你的按钮、填你的表单
前端·javascript·人工智能
天天喝旺仔34 分钟前
Vue 3 组合式 API:从 Options 迁移到 script setup
前端·javascript·vue.js
知了清语35 分钟前
以测试为盾,重构为矛——老旧前端系统迭代中的“测试先行”实践总结
前端
攀小黑1 小时前
vue3+Web Speech API 封装了一个弹窗语音输入
前端·macos·xcode
roamingcode1 小时前
4.5 小时,从一句话需求到可安装的 Chrome 插件:一次 AI 结对开发的完整复盘
前端·人工智能·chrome·claude·codex
️学习的小王2 小时前
Windows Claude Code 接入 Playwright‑MCP,调用本机Edge浏览器(避坑完整教程)
前端·windows·edge
律宏阔2 小时前
CloakBrowser 开发踩坑笔记
前端·浏览器