CODEWITHSUNDEEP
antdant-design-proantdv
Alejandro Chang
Alejandro Chang

Reputation: 1

Ant design charts - Trying to position legend at the bottom of the chart but no luck. Documentation doesn't show solution? https://ant-design-charts

Trying to place the legend at the bottom of the chart for any graph, but don't see any examples and the documentation does not provide a solution it seems (unless theres something I've missed). Any help would be appreciated.

How it currently looks: Chart

But I want the legend to be at the bottom of the chart, seems like a basic operation for such a complex library.

https://ant-design-charts.antgroup.com/en/options/plots/component/legend#%E5%9B%BE%E4%BE%8B%E9%A1%B9

I have tried:

  1. Looking into documentation and seeing if theres a way to change position - can't seem to see anything (Translating page using google translate so maybe theres something thats not being translated correctly?)
  2. Tried using config: { legend: { position: 'bottom'}, } but doesn't seem to work. Seems to work easier on F2/Ant but thats more for mobile and using ant-design-charts for my solution.

Upvotes: 0

Views: 568

Answers (1)

myonkun
myonkun

Reputation: 13

const pieConfig = {
        ----OTHER VALUE----
        legend: {
            color: {
                title: true, // try passing this property
                position: 'top', 
                rowPadding: 5,
            },
        },
}

have your tried something like this?

Upvotes: 1

Related Questions