Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

双环型图,pielabel指向错误 #901

Open
tangshuoup opened this issue May 29, 2020 · 0 comments
Open

双环型图,pielabel指向错误 #901

tangshuoup opened this issue May 29, 2020 · 0 comments

Comments

@tangshuoup
Copy link

tangshuoup commented May 29, 2020

image

`import F2 from '@antv/f2';

const data = [
{ name: '芳华', percent: 0.4, type: '1' },
{ name: '妖猫传', percent: 0.2, type: '1' },
{ name: '机器之血', percent: 0.18, type: '1' },
{ name: '心理罪', percent: 0.15, type: '1' },
{ name: '寻梦环游记', percent: 0.05, type: '1' },
{ name: '其他', percent: 0.12, type: '1' },
{ name: '芳华', percent: 0.4, type: '2' },
{ name: '妖猫传', percent: 0.2, type: '2' },
{ name: '机器之血', percent: 0.18, type: '2' },
{ name: '心理罪', percent: 0.15, type: '2' },
{ name: '寻梦环游记', percent: 0.05, type: '2' },
{ name: '其他', percent: 0.12, type: '2' }
];

const chart = new F2.Chart({
id: 'container',
pixelRatio: window.devicePixelRatio
});
chart.source(data);
chart.legend({
position: 'right'
});
chart.tooltip(false);
chart.coord('polar', {
transposed: true,
radius: 0.8,
inner: 0.5
});
chart.axis(false);
chart.interval()
.position('type*percent')
.color('name', [
'#1890FF',
'#13C2C2',
'#2FC25B',
'#FACC14',
'#F04864',
'#8543E0'
])
.adjust('stack');
chart.legend(false);
chart.pieLabel({
sidePadding: 30,
sidePadding: 10,
inflectionOffset: 20,
lineHeight: 48,
// adjustOffset: 50,
activeShape: true,
label1: function label1(value) {
return {
text: value.percent,
fill: '#343434',
fontWeight: 'bold'
};
},
label2: function label2(value) {
return {
text: value.name,
fill: '#999'
};
}
});
chart.interaction('pie-select', {
startEvent: 'tap',
animate: {
duration: 300,
easing: 'backOut'
},
cancelable: true
});

chart.render();`

如图所示label全部指向了第一个环形图

@tangshuoup tangshuoup changed the title 双环型图,pielable指向错误 双环型图,pielabel指向错误 May 29, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant