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

feat(label): implement label color inheritance from dependent elements #6536

Merged
merged 3 commits into from
Dec 5, 2024

Conversation

BQXBQX
Copy link
Contributor

@BQXBQX BQXBQX commented Dec 5, 2024

Implement the ability for labels to inherit colors from their associated graphical elements. This allows labels to automatically match the color of the elements they are describing.

  • Add style inheritance in label creation
  • Pass element style information to label callbacks
  • Add test case to verify the implementation
Checklist
  • npm test passes
image
  • commit message follows commit guidelines
Description of change

This PR implements the ability for labels to automatically inherit colors from their associated graphical elements in G2 charts.

Labels can now access and inherit styles from their dependent elements through the label callback's fourth parameter. This enables seamless color matching between labels and their graphical elements.

chart
  .interval()
  .encode('x', 'genre')
  .encode('y', 'sold')
  .encode('color', 'genre')
  .label({
    text: 'genre',
    // Label color will automatically match its graphical element
    fill: (_, i, array, d) => d.elementStyle.fill
  });

Implement the ability for labels to inherit colors from their associated
graphical elements. This allows labels to automatically match the color
of the elements they are describing.

- Add style inheritance in label creation
- Pass element style information to label callbacks
- Add test case to verify the implementation
@BQXBQX
Copy link
Contributor Author

BQXBQX commented Dec 5, 2024

#5474

@hustcc hustcc requested a review from pearmini December 5, 2024 03:39
@coveralls
Copy link

coveralls commented Dec 5, 2024

Pull Request Test Coverage Report for Build 12177125260

Details

  • 3 of 3 (100.0%) changed or added relevant lines in 1 file are covered.
  • No unchanged relevant lines lost coverage.
  • Overall coverage remained the same at 86.66%

Totals Coverage Status
Change from base Build 12153668750: 0.0%
Covered Lines: 10611
Relevant Lines: 11866

💛 - Coveralls

src/runtime/plot.ts Outdated Show resolved Hide resolved
@hustcc
Copy link
Member

hustcc commented Dec 5, 2024

另外,也帮忙改改文档中相关部分吧~ @BQXBQX

- Remove Proxy usage in label style callback to prevent browser compatibility issues
- Rename style parameter to elementStyle for better semantic clarity
- Update documentation to clarify elementStyle parameter usage in label callbacks
src/runtime/plot.ts Outdated Show resolved Hide resolved
@hustcc hustcc merged commit 56c0a3e into antvis:v5 Dec 5, 2024
2 checks passed
@hustcc
Copy link
Member

hustcc commented Dec 6, 2024

image

如果有钉钉的话,加个群,交流更方便,进群备注为 GitHub id。

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

Successfully merging this pull request may close these issues.

4 participants