WARNING: THIS SITE IS A MIRROR OF GITHUB.COM / IT CANNOT LOGIN OR REGISTER ACCOUNTS / THE CONTENTS ARE PROVIDED AS-IS / THIS SITE ASSUMES NO RESPONSIBILITY FOR ANY DISPLAYED CONTENT OR LINKS / IF YOU FOUND SOMETHING MAY NOT GOOD FOR EVERYONE, CONTACT ADMIN AT ilovescratch@foxmail.com
Skip to content

🐞 Bug: PieChart donut mode does not support transparent inner circle #1144

@engineer-dilnawaz

Description

@engineer-dilnawaz

Description

Description

When using the PieChart component with donut mode and setting
innerCircleColor="transparent", the center is not actually transparent.
Instead, it renders a filled circle (with default background), making it impossible to create a real donut chart with a see-through hole.

Steps to reproduce

Steps to Reproduce

<PieChart
  donut
  data={[
    { value: 45, color: 'white' },
    { value: 85, color: 'black' },
  ]}
  radius={70}
  innerRadius={35}
  innerCircleColor="transparent"
/>

Expected Behavior

The inner circle should be transparent, allowing the parent background (including gradients, images, or other components) to show through.

Actual Behavior

The inner circle is filled and blocks the background.
Setting transparent has no effect.

Snack or a link to a repository

No response

version of react-native-gifted-charts

1.4.63

React Native version

0.80.2

Platforms

iOS, Android

Workflow

React Native

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions