antv G2柱状图
一、首先需要引用antv-g2.1.直接在html引用外部js文件,<script src=’‘相对路径’’>2.如果是vue,需要安装 npm install @antv/g2 --save 但是在vscode安装后,按照提示修复一下就行了二、初始化柱状体表格const chart=new Chart({container:'attendanceChartDiv...
·
一、首先需要引用antv-g2.
1.直接在html引用外部js文件,<script src=’‘相对路径’’>
2.如果是vue,需要安装 npm install @antv/g2 --save
但是在vscode安装后,按照提示修复一下就行了
二、初始化柱状体表格
const chart=new Chart({
container:'attendanceChartDiv', //初始化的div ID
width:373, //跨度可以自适应 autoFit设置为true就可以了
height:220, //高度无法自适应只能设置固定值
padding: [30, 10, 30, 40] //图标间距
});
三、加载初始化数据
chart.legend(false);
chart
.interval()
.position('A*B') //*左侧是柱状图x左边显示的名字,右侧是柱状体数量
]);
chart.render();
这个是简单的加载,实际还有好多的方法和样式可以去设置,这个需要大家去自己研究了
更多推荐
已为社区贡献4条内容
所有评论(0)