8000 Pie Chart: 0% Label Renders Awkwardly, and Negative Values Crash Parser with Unclear Error · Issue #6584 · mermaid-js/mermaid · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Pie Chart: 0% Label Renders Awkwardly, and Negative Values Crash Parser with Unclear Error #6584

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.

Sign up for GitHub

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

Jump to bottom
Open
BambioGaming opened this issue May 11, 2025 · 0 comments
Open

Pie Chart: 0% Label Renders Awkwardly, and Negative Values Crash Parser with Unclear Error #6584

BambioGaming opened this issue May 11, 2025 · 0 comments
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect

Comments

@BambioGaming
Copy link

Description

When using the pie chart in Mermaid.js:

  • A slice with a value of 0 is rendered with a 0% label that overlaps the edge of the chart.
  • A slice with a negative value causes a MermaidParseError with an unclear error message.
  • The documentation does not mention these limitations, which may confuse users generating values dynamically.

Steps to reproduce

  1. Open the Mermaid Live Editor
  2. Paste the following diagram:
pie
  title Zero and Negative Values
  "Valid Slice" : 30
  "Zero Slice" : 0
  "Negative Slice" : -10

Actual Behavior

  • Mermaid fails to render the diagram.
  • Console shows a vague parser error:
    MermaidParseError: Parsing failed: unexpected character: - at offset: 81
  • The reason (negative value) is not explained.

If "Negative Slice" is removed:

pie
  title Zero and Negative Values
  "Valid Slice" : 30
  "Zero Slice" : 0
  • Diagram renders.
  • The "Zero Slice" appears in the legend and shows a 0% label at the top, overlapping the chart's border.
  • This creates misleading visuals in a data visualization.

Screenshots

  1. Chart with awkward 0% label placement

Image

  1. Console error for negative value

Image

Code Sample

Setup

  • Mermaid version: 11.6.0
  • Browser: Chrome 124
  • OS: Windows 11

Suggested Solutions

For Negative Values:

  • Reject them at parse time with a clear error message, such as: "Negative values are not allowed in pie charts. All slice values must be ≥ 0."

For Zero Values:

  • Option 1: Exclude them from the chart entirely.
  • Option 2: Render them without label, or place label inside the pie in a non-overlapping position.
  • Option 3: Add support for a hideZeroSlices: true flag in config.

Documentation:
Update Pie Chart Docs to explain behavior for 0 and negative values.

Additional Context

No response
@BambioGaming BambioGaming added Type: Bug / Error Something isn't working or is incorrect Status: Triage Needs to be verified, categorized, etc labels May 11, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@BambioGaming
0