antvis / antvis/G2

堆叠柱形图在使用 Slider 时,更新数据会导致柱形图渲染比例错误

Open
#6,466 1 comment 0 reactions 0 assignees View on GitHub
bug 🐛
Dominant language
TypeScript
Stars
12.6k
Forks
1.7k
PR merge metrics
No merged PRs in 30d

Description

### 问题描述

开启了 Slider 的柱形图,当柱形数量超过当前可是宽度时,更新数据会导致柱形的比例渲染异常

```
import { Chart } from '@antv/g2';
const data = [
{ name: 'London', 月份: 'Jan.', 月均降雨量: 18.9 },
{ name: 'London', 月份: 'Feb.', 月均降雨量: 28.8 },
{ name: 'London', 月份: 'Mar.', 月均降雨量: 39.3 },
{ name: 'London', 月份: 'Apr.', 月均降雨量: 81.4 },
{ name: 'London', 月份: 'May', 月均降雨量: 47 },
{ name: 'London', 月份: 'Jun.', 月均降雨量: 20.3 },
{ name: 'London', 月份: 'Jul.', 月均降雨量: 24 },
{ name: 'London', 月份: 'Aug.', 月均降雨量: 35.6 },

];

const chart = new Chart({
container: 'container',
autoFit: true,
});

chart
.interval()
.data(data)
.encode('x', '月份')
.encode('y', '月均降雨量')
//.encode('color', 'name')
//.transform({ type: 'stackY' })
.interaction('elementHighlight', { background: true })
.slider('x', {values: [0, 0.5]});

chart.render();

setTimeout(() => {
const node =chart.getNodeByType('interval');
node.data(data);
chart.render();
}, 3000);
```

Contributor guide

Open the contributing guide

Research direction

Start with the provided Chart reproduction, especially interval().data(), slider('x'), node.data(data), and chart.render(). Inspect the slider and data-update rendering path to determine why bar proportions change when the data is refreshed. Done means the reproduced chart keeps correct proportions after the delayed update.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.