antvis / antvis/F2

区间柱状图默认选中问题

Open
#967 2 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
8k
Forks
637
PR merge metrics
No merged PRs in 30d

Description

从官网例子上加入interaction交互,然鹅并没有用,默认选中不生效

```
import F2 from '@antv/f2';

const data = [{
x: '分类一',
y: [ 76, 100 ]
}, {
x: '分类二',
y: [ 56, 108 ]
}, {
x: '分类三',
y: [ 38, 129 ]
}, {
x: '分类四',
y: [ 58, 155 ]
}, {
x: '分类五',
y: [ 45, 120 ]
}, {
x: '分类六',
y: [ 23, 99 ]
}, {
x: '分类七',
y: [ 18, 56 ]
}, {
x: '分类八',
y: [ 18, 34 ]
}];
const chart = new F2.Chart({
id: 'container',
pixelRatio: window.devicePixelRatio
});
chart.source(data, {
y: {
tickCount: 5
}
});
chart.tooltip({
showItemMarker: false,
onShow: function onShow(ev) {
const items = ev.items;
items[0].name = '范围';
const value = items[0].value;
items[0].value = value[0] + ' 至 ' + value[1];
}
});
chart.interval().position('x*y').animate({
appear: {
animation: 'shapesScaleInY'
}
});
chart.render();
const canvas = chart.get('canvas');
chart.interaction('interval-select', {
selectAxisStyle: {
fill: '#000',
fontWeight: 'bold'
},
mode: 'range',
defaultSelected: {
x: '分类八',
y: [ 18, 34 ]
},
onEnd: function onEnd(ev) {
canvas.draw();
}
});
```

Contributor guide

Open the contributing guide

Research direction

Start by running the supplied F2 example and inspect the chart.interaction('interval-select', ...) entry point, especially the defaultSelected range for 分类八. Compare the rendered interval with the documented interaction behavior; done means the 分类八 interval is selected by default after chart.render().

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
data-visualization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 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.