IssueHuntantvis/G2
The issue has been closed
使用chart.option("scrollbar"）时无法使用chart.color('')设置颜色，否者会失效 #4227
jxguoguo posted onGitHub
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>滚动条设置颜色BUG</title>
</head>
<body>
<div id="container"></div>
<script src="https://gw.alipayobjects.com/os/lib/antv/g2/4.2.7/dist/g2.min.js"></script>
</body>
<script>
const data1 = [
{ type: '汽车', value: 34 },
{ type: '建材家居', value: 85 },
{ type: '住宿旅游', value: 103 },
{ type: '交通运输与仓储邮政', value: 142 },
{ type: '建筑房地产', value: 251 },
{ type: '教育', value: 367 },
{ type: 'IT 通讯电子', value: 491 },
{ type: '社会公共管理', value: 672 },
{ type: '医疗卫生', value: 868 },
{ type: '金融保险', value: 1234 },
];
const chart = new G2.Chart({
container: 'container',
autoFit: true,
height: 300,
});
function t1() {
test1(chart, data1)
}
t1()
function test1(chart, data) {
chart.clear()
chart.data(data);
chart.legend(false);
chart.coordinate().transpose();
chart
.interval()
.position('type*value')
.label('value', {
style: {
fill: '#8d8d8d',
},
offset: 10,
}).color('type');
chart.interaction('element-active');
chart.option("scrollbar", {
type: 'vertical',
width: 16,
categorySize: 80
})
chart.render();
console.log(chart.filteredData);
}
</script>
</html>