How to use the @nivo/colors.getInheritedColorGenerator function in @nivo/colors

To help you get started, we’ve selected a few @nivo/colors 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 / packages / pie / src / PieCanvasRenderer.js View on Github external
this.ctx.fillStyle = arc.color
            this.ctx.strokeStyle = getBorderColor({ ...arc.data, color: arc.color })
            this.ctx.lineWidth = borderWidth
            arcGenerator(arc)
            this.ctx.fill()
            if (borderWidth > 0) this.ctx.stroke()
        })

        if (enableSlicesLabels === true) {
            const { sliceLabel, slicesLabelsSkipAngle, slicesLabelsTextColor } = props

            drawSliceLabels(this.ctx, arcs, {
                arcGenerator,
                skipAngle: slicesLabelsSkipAngle,
                getLabel: getLabelGenerator(sliceLabel),
                getTextColor: getInheritedColorGenerator(slicesLabelsTextColor, theme),
                theme,
            })
        }

        if (enableRadialLabels === true) {
            const {
                radialLabel,
                radialLabelsSkipAngle,
                radialLabelsLinkOffset,
                radialLabelsLinkStrokeWidth,
                radialLabelsLinkDiagonalLength,
                radialLabelsLinkHorizontalLength,
                radialLabelsTextXOffset,
                radialLabelsTextColor,
                radialLabelsLinkColor,
            } = props
github plouc / nivo / packages / chord / src / enhance.js View on Github external
withPropsOnChange(['ribbonBorderColor', 'theme'], ({ ribbonBorderColor, theme }) => ({
            getRibbonBorderColor: getInheritedColorGenerator(ribbonBorderColor, theme),
        })),
        pure
github plouc / nivo / packages / treemap / src / enhance.js View on Github external
withPropsOnChange(['labelTextColor', 'theme'], ({ labelTextColor, theme }) => ({
        getLabelTextColor: getInheritedColorGenerator(labelTextColor, theme),
    })),
    withPropsOnChange(
github plouc / nivo / packages / sunburst / src / Sunburst.js View on Github external
withPropsOnChange(['childColor', 'theme'], ({ childColor, theme }) => ({
        getChildColor: getInheritedColorGenerator(childColor, theme),
    })),
    withPropsOnChange(
github plouc / nivo / packages / pie / src / Pie.js View on Github external
/>
                                        ))}
                                        {enableRadialLabels && (
                                            
                                        )}
                                        {enableSlicesLabels && (
github plouc / nivo / packages / sankey / src / enhance.js View on Github external
withPropsOnChange(['nodeBorderColor', 'theme'], ({ nodeBorderColor, theme }) => ({
            getNodeBorderColor: getInheritedColorGenerator(nodeBorderColor, theme),
        })),
        withPropsOnChange(['labelTextColor', 'theme'], ({ labelTextColor, theme }) => ({
github plouc / nivo / packages / pie / src / PieCanvasRenderer.js View on Github external
radialLabelsTextXOffset,
                radialLabelsTextColor,
                radialLabelsLinkColor,
            } = props

            drawRadialLabels(this.ctx, arcs, {
                radius,
                getLabel: getLabelGenerator(radialLabel),
                skipAngle: radialLabelsSkipAngle,
                linkOffset: radialLabelsLinkOffset,
                linkDiagonalLength: radialLabelsLinkDiagonalLength,
                linkHorizontalLength: radialLabelsLinkHorizontalLength,
                linkStrokeWidth: radialLabelsLinkStrokeWidth,
                textXOffset: radialLabelsTextXOffset,
                getTextColor: getInheritedColorGenerator(radialLabelsTextColor, theme),
                getLinkColor: getInheritedColorGenerator(radialLabelsLinkColor, theme),
                theme,
            })
        }

        this.ctx.restore()

        legends.forEach(legend => {
            renderLegendToCanvas(this.ctx, {
                ...legend,
                data: arcs.map(arc => ({
                    id: arc.data.id,
                    label: arc.data.id,
                    color: arc.color,
                })),
                containerWidth: width,
                containerHeight: height,
github plouc / nivo / packages / pie / src / PieCanvasRenderer.js View on Github external
this.surface.width = outerWidth * pixelRatio
        this.surface.height = outerHeight * pixelRatio

        this.ctx.scale(pixelRatio, pixelRatio)
        this.ctx.fillStyle = theme.background
        this.ctx.fillRect(0, 0, outerWidth, outerHeight)
        this.ctx.save()
        this.ctx.translate(margin.left, margin.top)

        arcGenerator.context(this.ctx)

        this.ctx.save()
        this.ctx.translate(centerX, centerY)

        const getBorderColor = getInheritedColorGenerator(borderColor, theme)

        arcs.forEach(arc => {
            this.ctx.beginPath()
            this.ctx.fillStyle = arc.color
            this.ctx.strokeStyle = getBorderColor({ ...arc.data, color: arc.color })
            this.ctx.lineWidth = borderWidth
            arcGenerator(arc)
            this.ctx.fill()
            if (borderWidth > 0) this.ctx.stroke()
        })

        if (enableSlicesLabels === true) {
            const { sliceLabel, slicesLabelsSkipAngle, slicesLabelsTextColor } = props

            drawSliceLabels(this.ctx, arcs, {
                arcGenerator,
github plouc / nivo / packages / heatmap / src / enhance.js View on Github external
withPropsOnChange(['cellBorderColor', 'theme'], ({ cellBorderColor, theme }) => ({
            getCellBorderColor: getInheritedColorGenerator(cellBorderColor, theme),
        })),
        withPropsOnChange(['labelTextColor', 'theme'], ({ labelTextColor, theme }) => ({