antv g2 x轴两边留边距
antv g2 x轴两边留边距问题背景:在做vue项目时,需要用到-蚂蚁数据可视化antv做数据图表。问题:图表的内容超出了x轴的边缘这个问题看了很久,网上的解释很少,最后还是看文档终于找到了原因源代码:var chart = new G2.Chart({container: 'mountNode1',forceFit: true,he...
·
antv g2 x轴两边留边距
问题背景:在做vue项目时,需要用到-蚂蚁数据可视化antv做数据图表。
问题:
图表的内容超出了x轴的边缘
这个问题看了很久,网上的解释很少,最后还是看文档终于找到了原因
源代码:
var chart = new G2.Chart({
container: 'mountNode1',
forceFit: true,
height: 190,
padding: [20, 85, 35, 45]
});
chart.source(data);
chart.scale('count', {
alias: '人数',
});
chart.interval().position('date*count');
chart.render();
加上下面这一段代码就可以了
var margin = 1 / data.length;
chart.scale("date", {
range: [margin / 2, 1 - margin / 2],
});
结果
官方文档解释:
range: {array}, // 输出数据的范围,默认[ 0, 1 ],格式为 [ min, max ],min 和 max 均为 0 至 1 范围的数据。
更多推荐
已为社区贡献1条内容
所有评论(0)