Skip to content

fix: circle and hex layout break with 0 or 1 items #71

@wazolab

Description

@wazolab

Severity

P1 — Broken UI

Description

Both `unfoldedClusterRenderCircle` and `unfoldedClusterRenderHexaGrid` in `src/utils/helpers.ts` compute radius as:
```ts
const radius = (markerSize / 2) / Math.sin(Math.PI / items.length)
```

With 1 item: `Math.sin(Math.PI / 1) = Math.sin(π) ≈ 1.2e-16` → radius ≈ `1e17` pixels. The container becomes astronomically large and the marker is positioned off-screen.

With 0 items: `Math.PI / 0 = Infinity`, `Math.sin(Infinity) = NaN` → radius is `NaN`, producing `NaN`-dimensioned containers.

While `unfoldedClusterRenderSmart` delegates to circle for ≤5 items (which includes 0 and 1), and the main class guards with `unfoldedClusterMaxLeaves`, these layout functions are exported as public API — consumers calling them directly will hit this.

Suggested Fix

Add early returns at the top of both functions:
```ts
if (items.length === 0) return
if (items.length === 1) {
const featureHTML = renderMarker(items[0])
featureHTML.addEventListener('click', (event) => clickHandler(event, items[0]))
parent.append(featureHTML)
return
}
```

Files

  • `src/utils/helpers.ts:24` (`unfoldedClusterRenderCircle`)
  • `src/utils/helpers.ts:70` (`unfoldedClusterRenderHexaGrid`)

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions