antvis / antvis/G2

如何能调节shape的层级 使其不遮挡pieLabel

Open
#6,359 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
12.6k
Forks
1.7k
PR merge metrics
No merged PRs in 30d

Description

- [ ] I have searched the [issues](https://github.com/antvis/g2/issues) of this repository and believe that this is not a duplicate.

### What problem does this feature solve?
项目需要

### What does the proposed API look like?
chart.pieLabel({
anchorOffset: -5, // 锚点偏移量 (为负数锚点直接插入环形图中)
inflectionOffset: 10, // 拐点偏移量
sidePadding: 10, // 文本距离画布左右两边的距离。
adjustOffset: 10,
lineStyle: {
// stroke: '#888', // 线条颜色 默认相同于饼颜色
lineWidth: 1, // 线条宽度
lineDash: [2, 1] // 虚线样式
},
label1: function label1(data) {
console.log(data);
return {
text: `${that.$translation('g_xmxqy_nr_tp_xx', '选项')}${data.sequence}`,
fill: '#888888',
textAlign: 'start'
};
}
});
![截屏2024-07-15 16 06 18](https://github.com/user-attachments/assets/6c4c158d-934f-4bcf-a591-574acfaf51eb)
![截屏2024-07-15 16 06 55](https://github.com/user-attachments/assets/c46cc4d9-cea9-4219-9614-3111490743c2)

....
chart.render();
const coord = chart.get('coord');
chart.get('canvas').addShape('sector', {
attrs: {
x: coord.center.x,
y: coord.center.y,
r: coord.circleRadius * 1.1,
r0: coord.circleRadius,
fill: shapeColor,

}
});
chart.get('canvas').draw();

Contributor guide

Open the contributing guide

Research direction

Reproduce the pie chart using the chart.pieLabel configuration and the post-render canvas.addShape('sector') example in the issue. Start by tracing the pie-label and canvas shape entry points, then verify that the added sector no longer obscures pie labels; no repository file or test is named, so locating coverage is part of the work.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization
Issue type
Feature
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.