页面树结构
转至元数据结尾
转至元数据起始

(本文档仅供参考)

问题

想修改图例的布局从 横向排版 变成 竖向排版,同时修改图例的间距,以及未选择状态下的颜色

解决方案

可以使用扩展属性实现,如下:

{
    "legend": {
        "show": "ture", //图例显示
        "orient": "vertical", //图例布局朝向,vertical竖向排版,horizontal横向
        "align": "left", //图例对齐方式
        "itemGap": 20, //修改图例的间距
        //未选择默认是灰色,若想自定义设置未选择的颜色,可改下面的属性
        "inactiveColor": "pink",
        "textStyle": {
            "color": "#424e67",
            "fontStyle": "normal",
            "fontWight": "normal",
            "fontFamily": "微软雅黑",
            "fontSize": "12px",
            "lineHeight": "20px"
        } //图例文字样式
    }
}

同时需要设置这里的边距,如下图:

效果图如下:

备注:若图例较多且间距设置过大可能会出现如下效果:

 

此现象可以通过适当调大下边距来解决:

 

效果如下:


  • 无标签