美文网首页
g2持续更新

g2持续更新

作者: danihay | 来源:发表于2017-09-12 22:20 被阅读20次

    1.配置自定义的颜色列表

    chart.color('type',['red','green','yellow'])

    2.图例样式说明设置,文档链接https://antv.alipay.com/g2/api/chart.html中的chart.legend方法。

    2

    chart.legend({

    position:'right',// 图例的显示位置,有 'top','left','right','bottom'四种位置,默认是'right'。

    leaveChecked:false,// 是否保留一项不能取消勾选,默认为 false,即不能取消勾选。

    mode:'multiple'||'single'||false,// 设置图例筛选模式,默认为 'multiple' 多选,'single' 表示单选,false 表示禁用筛选

    title:null,// 是否展示图例的标题,null 为不展示,默认 top bottom 两个位置的图例不展示标题。

    spacingX:10,// 用于 position 为 top 或者 bottom 时调整子项之间的水平距离

    spacingY:12,// 用于 position 为 left 或者 right 时调整子项之间的垂直距离

    unChecked:'#CCC',// 未选中时 marker 的颜色

    wordSpaceing:2,// marker 和文本之间的距离

    dx:5, // 控制其x坐标位置

    dy:10,//控制其y坐标位置

    itemWrap:false,// 是否自动换行,默认为 false,true 为自动换行

    word:{

    fill:'red',

    fontSize:14

    },// 图例各个子项文本的颜色

    back:{

    fill:'red'

    },// 图例外边框和背景的配置信息

    formatter:function(val){

    returnval+'%';

    },// 格式化图例项的文本显示

    marker:'circle','square','bowtie','diamond','hexagon','triangle'// 配置 marker 的显示形状

    });

    相关文章

      网友评论

          本文标题:g2持续更新

          本文链接:https://www.haomeiwen.com/subject/hophsxtx.html