精华内容
下载资源
问答
  • 一、大小不固定,多行文字垂直居中 ① 单行文字 可能很多人都知道如何让单行文字垂直居中显示,就是使用line-height,将line-height值...这是第二行文字,您还可以再添加一行文字做测试!这是隐藏第三行文字,注意
  • 近期,在开发中遇到一个问题,就是用echarts插件画饼图时,图例是横向...如图所示,第二行的图例并没有和第一行的图例对齐.这是因为插件在图例横向排列的时候,自动根据图例的文字多少自动排列. 开始查了很多资料,百度了...
        

    近期,在开发中遇到一个问题,就是用echarts插件画饼图时,图例是横向排布的时候,如果换行了,如何让图例图标对齐?由于网上关于这个的处理方案具体实现细节的解答比较少,所以写出来.
    问题展示图如下:

    clipboard.png

    如图所示,第二行的图例并没有和第一行的图例对齐.这是因为插件在图例横向排列的时候,自动根据图例的文字多少自动排列.

    开始查了很多资料,百度了下,也没找到好的方法.然后试着用富文本处理下,没有处理好.最后在网上求助网友,终于解决了.

    方案一: 设置图例文字的宽度,这里设置图例文字的宽度是需要用富文本处理的.不然设置是没有作用的.(感谢网友:https://segmentfault.com/u/hu...提供帮助).
    本来的代码: (不对齐的)

    legend:{
                    show: true,
                    type: 'plain',
                    itemGap: 10,
                    bottom: '5%',
                    orient: 'horizontal',
                    data:[
                            {
                                name: '无抵押',
                                icon: 'circle',
                                textStyle:{
                                    color: 'black'
                                }
                            },
                            {
                                name: '有抵押',
                                icon: 'circle',
                                textStyle:{
                                    color: 'black'
                                }
                            },
                            {
                                name: '宝单保',
                                icon: 'circle',
                                textStyle:{
                                    color: 'black'
                                }
                            },
                            {
                                name: '万商贷',
                                icon: 'circle',
                                textStyle:{
                                    color: 'black'
                                }
                            },
                            {
                                name: 'O2O',
                                icon: 'circle',
                                textStyle:{
                                    color: 'black'
                                }
                            },{
                            name: 'O2O1666',
                            icon: 'circle',
                            textStyle:{
                                color: 'black'
                            }
                        },{
                            name: 'O2O25665',
                            icon: 'circle',
                            textStyle:{
                                color: 'black'
                            }
                        },
                            {
                                name: '直销',
                                icon: 'circle',
                                textStyle:{
                                    color: 'black'
                                }
                            }
                    ]
    
                },
                

    利用富文本设置宽度:

    legend:{
                    show: true,
                    type: 'plain',
                    bottom: '2%',
                    orient: 'horizontal',
                    formatter: function( name ) {
                         return '{a|' + name + '}';
                        },
                    textStyle: {
                            color: '#ca8622',
                        backgroundColor: 'red',               
                        rich: {
                                a: {
                                    width: 90
                                }
                        }
                    },
                    
    

    注意需要用 formatter设置去指定富文本,否则是没有作用的.

    方案二: 在dada中加入空字符串(此方法好像不大正统,斟酌使用...)
    首先设置图例排列为纵向排列,然后看下你需要排几行.就隔几个加空格,比如我需要两行.就隔开2个.

    
    legend:{
                    show: true,
                    type: 'plain',
                    bottom: '2%',
                    orient: 'vertical',
                    data:[
                            {
                                name: '无抵押大幅度',
                                icon: 'circle',                          
                            },
                            {
                                name: '有抵押',
                                icon: 'circle',                          
                            },
                            {
                                name: ''
                            },
                            {
                                name: '万商贷',
                                icon: 'circle',
                            },
                            {
                                name: 'O2O',
                                icon: 'circle',
                            },
                            {
                                name: ''
                            },
                            {
                                name: '直销',
                                icon: 'circle',
                            }
                    ]
    
                },
                

    效果图:

    clipboard.png

    当然还有一种最渣的方案:文字后面加空格,这种方案太渣了就不说了.

    展开全文
  • 本书是I卷,以开发人员在项目开发中经常遇到问题必须掌握技术为中心,介绍了应用Java Web进行程序开发各个方面知识技巧,主要包括Java Web编程基础、文件操作管理、图形图像与多媒体技术、窗体应用...
  • 你必须知道495个C语言问题

    千次下载 热门讨论 2015-05-08 11:09:25
    1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 1.29 为什么我编译器不允许我定义大数组,如doublearray[256][256]? 命名空间 1.30如何判断哪些标识符可以使用,哪些被保留了...
  • 本书是I卷,以开发人员在项目开发中经常遇到问题必须掌握技术为中心,介绍了应用Java Web进行程序开发各个方面知识技巧,主要包括Java Web编程基础、文件操作管理、图形图像与多媒体技术、窗体应用...
  • 《你必须知道495个C语言问题》

    热门讨论 2010-03-20 16:41:18
    1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 15 1.29 为什么我编译器不允许我定义大数组,如double array[256][256]? 15 命名空间 15 1.30 如何判断哪些标识符可以使用,...
  • 1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 44 1.29 为什么我编译器不允许我定义大数组,如double array[256][256]? 44 命名空间 44 1.30 如何判断哪些标识符可以使用,...
  • 1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 44 1.29 为什么我编译器不允许我定义大数组,如double array[256][256]? 44 命名空间 44 1.30 如何判断哪些标识符可以使用,...
  • 1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 15 1.29 为什么我编译器不允许我定义大数组,如double array[256][256]? 15 命名空间 15 1.30 如何判断哪些标识符可以使用,...
  • 1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 1.29 为什么我编译器不允许我定义大数组,如double array[256][256]? 命名空间 1.30 如何判断哪些标识符可以使用,哪些被保留了?...
  • 1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么?  1.29 为什么我编译器不允许我定义大数组,如doublearray[256][256]?  命名空间  1.30如何判断哪些标识符可以使用,哪些被...
  • 1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 1.29 为什么我编译器不允许我定义大数组,如double array[256][256]? 命名空间 1.30 如何判断哪些标识符可以使用,哪些被保留了?...
  •  1.28 文件中的第一个声明就报出奇怪语法错误,可我看没什么问题。这是为什么? 1.29 为什么我编译器不允许我定义大数组,如doublearray[256][256]? 命名空间 1.30如何判断哪些标识符可以使用,哪些被保留...
  • excel使用

    2012-11-25 17:06:01
    实际输入时候,通常应用等差数列输入法,先输入前个值,定出自变量中数与数之间步长,然后选中A2A3两个单元格,使这项变成个带黑色边框矩形,再用鼠标指向这黑色矩形右下角小方块“■”,当光标...
  • 如何去掉单元格中的第一个数字? 论一下取最后一个单词方法 如何去掉单元格最后一位数字 如何在一列已经输入数据前添加“p” 什么函数可以插入字符 如何在数据前添加“*”号 数字前面加上数字 【数据拆分与...
  • EXCEL函数公式集

    热门讨论 2010-03-16 03:26:38
    如何去掉单元格中的第一个数字? 论一下取最后一个单词方法 如何去掉单元格最后一位数字 如何在一列已经输入数据前添加“p” 什么函数可以插入字符 如何在数据前添加“*”号 数字前面加上数字 【数据拆分与...
  • 光标移到第二章,这时可以看到第二页眉和第一章是相同,鼠标双击页眉Word会弹出页眉页脚工具栏,工具栏上有一个“同前”按钮(图像按钮,不是文字),这个按钮按下表示本节页眉与前一节相同,我们需要是各...

空空如也

空空如也

1 2 3 4
收藏数 61
精华内容 24
关键字:

如何让第二行的字和第一行的字对齐