Squarified

squarified is a minimal and powerful treemap component.

https://github.com/user-attachments/assets/caf30d9d-0a5a-446a-b767-7927bf4387c9

Install

$ yarn add squarified

Usage

See the dev directory for a minimal example.

API

// convert data into expected data
declare function c2m<
  T extends AnyObject & {
    groups: any[]
  },
  K extends keyof T
>(data: T, key: K, modifier?: (data: T) => T): T & {
  weight: number
}

// preset theme layout (unstable)
declare function presetDecorator(app: TreemapLayout): void

declare function getNodeDepth(node: NativeModule): number

declare function visit<T extends AnyObject>(data: T[], fn: (data: T) => boolean | void): T | null

declare function findRelativeNode(p: {
  x: number,
  y: number
}, layoutNodes: LayoutModule[]): LayoutModule | null

declare function findRelativeNodeById(id: string, layoutNodes: LayoutModule[]): LayoutModule | null

interface App {
  init: (el: HTMLElement) => void
  dispose: () => void
  setOptions: (options: TreemapOptions) => void
  resize: () => void
  use: (using: Using, register: (app: TreemapLayout) => void) => void
  zoom: (id: string) => void
}

declare function createTreemap(): App

Auth

Kanno

LICENSE

MIT

0.3.7

Rebuild

0.3.5

Fix type error.

0.3.4

Increase color brightness.

0.3.2

Fix render crash.

0.3.1

Add render fallback.

0.3.0

Happy New year. This version improves performance and provides a smooth UI.

0.2.2

Fix error build

0.2.1

Optimize render and cache.

0.2.0

Break preset color scheme. Add cache

0.1.2

Some rendering optimize.

0.1.1

• Fix error zooming logic.
• Expose more friednly tool.

0.1.0

First version.