rumble-charts/types/Cloud.d.ts

Truly declarative React charts components

import type { ReactElement } from 'react';
import type { GraphicProps, Point, Series, Style } from './types';
export declare type FontStyle = 'normal' | 'italic' | 'oblique' | 'inherit';
export declare type FontWeight = 'normal' | 'bold' | 'bolder' | 'lighter' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
export declare type CloudLabel = Point & {
    text: string;
    size: number;
    seriesIndex: number;
    pointIndex: number;
};
export declare type CloudSeriesParams = {
    seriesIndex: number;
    series: Series;
    props: CloudProps;
};
export declare type CloudLabelParams = {
    seriesIndex: number;
    pointIndex: number;
    point: Point;
    label: CloudLabel;
    series: Series;
    props: CloudProps;
};
export declare type CloudProps = {
    font?: string | ((params: CloudLabel, index: number) => string);
    minFontSize?: number;
    maxFontSize?: number;
    timeInterval?: number;
    fontStyle?: FontStyle | ((params: CloudLabel, index: number) => FontStyle);
    fontWeight?: FontWeight | ((params: CloudLabel, index: number) => FontWeight);
    /**
     * Angle in degrees
     */
    rotate?: number | ((params: CloudLabel, index: number) => number);
    /**
     * Type of spiral used for positioning words. This can either be one of the two
     * built-in spirals, "archimedean" and "rectangular", or an arbitrary spiral
     * generator can be used, of the following form
     */
    spiral?: 'archimedean' | 'rectangular' | ((size: [number, number]) => (t: number) => [number, number]);
    padding?: number | ((params: CloudLabel, index: number) => number);
    random?: () => number;
    labelVisible?: boolean | ((params: CloudLabelParams) => boolean);
    labelAttributes?: Record<string, unknown> | ((params: CloudLabelParams) => Record<string, unknown>);
    labelStyle?: Style | ((params: CloudLabelParams) => Style);
    seriesVisible?: boolean | ((params: CloudSeriesParams) => boolean);
    seriesAttributes?: Record<string, unknown> | ((params: CloudSeriesParams) => Record<string, unknown>);
    seriesStyle?: Style | ((params: CloudSeriesParams) => Style);
} & GraphicProps;
/**
 * Renders cloud of tags/keywords. Uses [d3-cloud](https://www.npmjs.com/package/d3-cloud) for calculations.
 * Please notice, `series` data points should have `label` attribute. See example below.
 */
export declare function Cloud(props: CloudProps): ReactElement;