g2持续更新

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 的显示形状

});

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 背景 一年多以前我在知乎上答了有关LeetCode的问题, 分享了一些自己做题目的经验。 张土汪:刷leetcod...
    土汪阅读 12,859评论 0 33
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,156评论 0 1
  • 每个人就仅有那么一次青春的回忆, 不是每个人的青春都像春雨滋润过后的大地,万物生机, 不是每个人的青春都如夏花般开...
    e62a12d1b933阅读 409评论 0 1
  • 请了周四周五的假,周三晚坐上回乡的火车。 车遇俩奇人,给了我这个不知天高地厚的小子几句忠告。 想去追求我心中的她。...
    胡心白阅读 155评论 0 0

友情链接更多精彩内容