在做一些图标时,有时会出现显示文字过长的问题,需要将其按照指定的字数换行,像下图这样

而echarts没有提供换行的方法,但是可以使用fomatter方法进行设置,代码如下

formatter: function(val) {
var strs = val.split(''); //字符串数组
var str = ''
for(var i = 0, s; s = strs[i++];) { //遍历字符串数组
str += s;
if(!(i % 2)) str += '\n'; //按需要求余
}
return str
}

成功! 此方法可以用在任何支持fomatter方法的设置里

echarts图表里label文字过长换行的方法的更多相关文章

  1. css 样式 文字过长 换行处理方法

    css强制换行.强制不换行及自动换行的写法 css强制不换行 div{white-space:nowrap;} css自动换行 div{ word-wrap: break-word; word-bre ...

  2. echarts图表X轴文字过长解决解决方案:根据文字长度自动旋转

    Echarts 标签中文本内容太长的时候怎么办 ? 关于这个问题搜索一下,有很多解决方案.无非就是 省略(间隔显示).旋转文字方向.竖排展示 前面两种解决方案,就是echarts暴露的: {   ax ...

  3. 关于dl dt dd 文字过长换行在移动端显示对齐的探讨总结

    关于dl  dt dd 文字过长换行在移动端显示对齐的探讨总结 <dl> <dt>抵押房产:</dt> <dd>1.北京市大兴区兴华大街丽园小区3单大兴 ...

  4. 关于echarts中的饼状图的label文字显示过长的问题

    label: { normal: { fontSize: 14, formatter(v) { let text = v.name let count = text.indexOf('¥') cons ...

  5. 解决echarts中X轴文字过长的问题。【转】

    axisLabel: { interval: , formatter:function(value) { debugger var ret = "";//拼接加\n返回的类目项 ; ...

  6. echarts统计图Y轴(或X轴)文字过长问题解决

    echarts 统计图Y轴文字过长 在使用echarts时,出现数值非常大,Y轴又显示不下的情况就需要压缩Y轴数值刻度. 解决方法: yAxis: { type: 'value', axisLabel ...

  7. echarts2 饼图处理标签文字过长使之达到指定字数换行的目的

    在使用echarts2的过程中,有时会遇到标签文字过长导致显示不完整的问题.例如: 这时候就需要用到 标签里的formatter 回调函数来处理这种情况了. 方式一:  formatter : ' { ...

  8. Echarts中axislabel文字过长导致显示不全或重叠

    最近在使用Echarts的时候,遇到点问题就是xAxis文字过长导致x轴的文字显示不全. 解决方案如下: 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HT ...

  9. 关于IOS中safari下的select下拉菜单,文字过长不换行的问题

    今天遇到下图这种问题,文字过长,显示不全.折腾了老半天,在网上搜了半天也找不到解决方案. 于是问了下同事,同事提到了<optgroup>,这个标签厉害. <optgroup> ...

随机推荐

  1. 如何在MQ中实现支持任意延迟的消息?

    什么是定时消息和延迟消息? 定时消息:Producer 将消息发送到 MQ 服务端,但并不期望这条消息立马投递,而是推迟到在当前时间点之后的某一个时间投递到 Consumer 进行消费,该消息即定时消 ...

  2. 模板引擎(smarty)知识点总结

    首先我们必须知道使用smarty的流程   1.引入   2.实例化   3.配置 模板目录  编译目录  3.0版本 支持不存在的目录则新建   4.赋值   5.编译显示 某个模板文件(暗示需要哪 ...

  3. tr 命令详解

    tr  作用:标准输入中通过替换或删除操作进行字符转换 语法:tr -c -d -s ["string1_to_translate_from"] ["string2_to ...

  4. Cleaner, more elegant, and harder to recognize(翻译)

    Cleaner, more elegant, and harder to recognize 更整洁,更优雅,但更难识别 看来,有些人把我几个月前一篇文章的标题"Cleaner,more e ...

  5. Windows,Mac与Linux哪个更适合开发者?

        以前写的,怕引来口水战,干脆不发.这段时间面试了十来人,用Mac的开发水平明显高于Windows的,挺多感想的,于是改改发了吧.      Windows: 对普通用户而言体验最友好,对开发者 ...

  6. asp.net 限制上传文件的大小与时间

    在web.Config文件中配置限制上传文件大小与时间的字符串是在<httpRuntime><httpRuntime/>节中完成. maxRequsetLength 属性:用于 ...

  7. Effective Java 第三版——16.在公共类中使用访问方法而不是公共属性

    Tips <Effective Java, Third Edition>一书英文版已经出版,这本书的第二版想必很多人都读过,号称Java四大名著之一,不过第二版2009年出版,到现在已经将 ...

  8. 前端安全之XSS攻击及防御

    xss攻击是什么 ? XSS攻击类似于SQL注入攻击,攻击之前,我们先找到一个存在XSS漏洞的网站,XSS漏洞分为两种,一种是DOM Based XSS漏洞,另一种是Stored XSS漏洞.理论上, ...

  9. TurnipBit之DIY无线遥控智能小车

    一.准备工作 TurnipBit 开发板 2块 TurnipBit 扩展板 1块 数据线 1条 智能小车器件 1套 电机驱动模块(L298N) 1个 在线可视化编程 点击进入   二.思路设计   2 ...

  10. 动手搭建第一个小程序音视频Demo

    欢迎大家前往云+社区,获取更多腾讯海量技术实践干货哦~ 作者:小程序音视频产品经理 腾讯云提供了全套技术文档和源码来帮助您快速构建一个音视频小程序,但是再好的源码和文档也有学习成本,为了尽快的能调试起 ...