Ряд столбцов не отображается правильно под меткой с использованием библиотеки реагировать - PullRequest
Новая
       5

Ряд столбцов не отображается правильно под меткой с использованием библиотеки реагировать

0 голосов
/ 07 января 2020

Я столкнулся с проблемой. Серия баров не подходит под маркой. Я не могу понять, что происходит не так.

enter image description here

Вот код для этого 

const FlexibleXYPlot = makeWidthFlexible(XYPlot);


<FlexibleXYPlot height={graphContainer.height} margin={graphContainer.margin} xDistance={0} xType="ordinal">
        <HorizontalGridLines />
        <XAxis/>
        <YAxis orientation="right" style={yAxisStyles} />
        {  this.state.data.map((lineData, i) => (
      <VerticalBarSeries
        key={i}
        data={lineData.timeline}
      />
    )); }
      </FlexibleXYPlot>

и данные это 

[
    {
      "timeline": [
        {
          "x": "dataA",
          "y": 12.21
        }
      ]
    },
    {
      "timeline": [
        {
          "x": "dataB",
          "y": 21.09
        }
      ]
    },
    {
      "timeline": [
        {
          "x": "dataC",
          "y": 16.66
        }
      ]
    }

1 Ответ

1 голос
/ 07 января 2020

Я понял это.

Для каждого бара я создавал отдельные серии. Мне просто нужно было передать все данные в одну серию. Теперь, если кто-то хочет, чтобы каждый столбец имел отдельный цвет в одной серии, он может передать цвет с данными, приведенными ниже 

[
    {
          "x": "dataA",
          "y": 12.21,
          "color": <something>
    },
    {

          "x": "dataB",
          "y": 21.09,
          "color": <something>
    },
    {
          "x": "dataC",
          "y": 16.66,
          "color": <something>
    }
]

, и нам нужно передать colorType="literal" самой серии.

...