How to use the @nivo/heatmap.HeatMapDefaultProps.hoverTarget function in @nivo/heatmap

To help you get started, we’ve selected a few @nivo/heatmap 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 / data / components / heatmap / props.js View on Github external
`,
    },
    {
        key: 'hoverTarget',
        flavors: ['svg', 'canvas'],
        help: 'Defines hover behavior.',
        description: `
            Defines hover behavior:

            - **cell**: highlight the current cell
            - **row**: highlight the current cell's row
            - **column**: highlight the current cell's column
            - **rowColumn**: highlight the current cell's row & column
        `,
        required: false,
        defaultValue: defaults.hoverTarget,
        type: 'string',
        controlType: 'choices',
        group: 'Interactivity',
        controlOptions: {
            choices: ['cell', 'row', 'column', 'rowColumn'].map(key => ({
                label: key,
                value: key,
            })),
        },
    },
    {
        key: 'cellHoverOpacity',
        flavors: ['svg', 'canvas'],
        help: 'Cell opacity on hover.',
        required: false,
        defaultValue: defaults.cellHoverOpacity,
github plouc / nivo / website / src / components / charts / heatmap / props.js View on Github external
{
        key: 'hoverTarget',
        scopes: ['HeatMap', 'HeatMapCanvas'],
        description: (
            <div>
                Defines hover behavior:
                <br>- <strong>cell</strong>: highlight the current cell
                <br>- <strong>row</strong>: highlight the current cell's row
                <br>- <strong>column</strong>: highlight the current cell's column
                <br>- <strong>rowColumn</strong>: highlight the current cell's row &amp; column
                <br>
            </div>
        ),
        help: 'Defines hover behavior.',
        required: false,
        default: defaults.hoverTarget,
        type: '{number}',
        controlType: 'choices',
        controlGroup: 'Interactivity',
        controlOptions: {
            choices: ['cell', 'row', 'column', 'rowColumn'].map(key =&gt; ({
                label: key,
                value: key,
            })),
        },
    },
    {
        key: 'cellHoverOpacity',
        scopes: ['HeatMap', 'HeatMapCanvas'],
        description: 'Cell opacity on hover (0~1).',
        required: false,
        default: defaults.cellHoverOpacity,