How to use the @nivo/circle-packing.BubbleDefaultProps.padding function in @nivo/circle-packing

To help you get started, we’ve selected a few @nivo/circle-packing examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github plouc / nivo / website / src / components / charts / bubble / props.js View on Github external
<a rel="noopener noreferrer" href="https://github.com/d3/d3-hierarchy#pack_padding">
                    official d3 documentation
                </a>
                . Please be aware that when zoomed, this value will be affected by the zooming
                factor.
            
        ),
        help:
            'Padding between each circle (animated). Please be aware that when zoomed, this value will be affected by the zooming factor.',
        type: '{number}',
        required: false,
        default: defaults.padding,
        controlType: 'range',
        controlGroup: 'Base',
        controlOptions: {
            unit: 'px',
            min: 0,
            max: 32,
        },
    },
    /*##################################################################################################################

        Style

    ##################################################################################################################*/
    {
        key: 'colors',
        scopes: '*',
github plouc / nivo / website / src / data / components / bubble / props.js View on Github external
controlType: 'margin',
        group: 'Base',
    },
    {
        key: 'padding',
        help: 'Padding between each circle.',
        description: `
            Padding between adjacent circles.
            Please be aware that when zoomed
            this value will be affected by the zooming factor
            and is expressed in pixels. See the
            [official d3 documentation](https://github.com/d3/d3-hierarchy#pack_padding).
        `,
        type: 'number',
        required: false,
        defaultValue: defaults.padding,
        controlType: 'range',
        group: 'Base',
        controlOptions: {
            unit: 'px',
            min: 0,
            max: 32,
        },
    },
    {
        key: 'colors',
        help: 'Defines how to compute node color.',
        description: `
            colors used to colorize the circles,
            [see dedicated documentation](self:/guides/colors).
        `,
        type: 'string | Function | string[]',