Невозможно привести таблицу измерений (используя Recharts P ie) для контейнера - PullRequest
Новая
       30

Невозможно привести таблицу измерений (используя Recharts P ie) для контейнера

0 голосов
/ 09 апреля 2020

У меня есть базовый c компонент диаграммы (см. Ниже), который отображает PieChart с startAngle = {180} и endAngle = {0}, но я не могу сделать так, чтобы он соответствовал контейнеру ...

Как это выглядит сейчас:

enter image description here

Как это должно выглядеть:

enter image description here

Демонстрация базовой версии c: https://codesandbox.io/s/recharts-playground-3zibx

1 Ответ

1 голос
/ 09 апреля 2020

Вы можете использовать поля сверху и снизу. Например, для (ширина: 500, высота: 260) вы должны установить (верх: 760, низ: 500):

Чтобы использовать полную ширину и придерживаться снизу:

Верх = Ширина + Высота, Низ = Ширина 

<div style={{ width: 500, height: 260, border: "1px solid black" }}>
      <PieChart height={260} width={500} margin={{ top: 760, bottom: 500 }}>
        <Pie
          startAngle={180}
          endAngle={0}
          innerRadius="56%"
          data={data}
          dataKey="value"
          labelLine={false}
          blendStroke
          isAnimationActive={false}
        >
          <Cell fill="#000" />
          <Cell fill="#eaeaea" />
        </Pie>
      </PieChart>
    </div>
...