React-Vis MarkSeries ColorRange не работает - PullRequest
Новая
       47

React-Vis MarkSeries ColorRange не работает

0 голосов
/ 25 октября 2018

Установка всех цветов на уровне точки данных на ноль не работает.

Рабочий пример:

Если вы установите все цвета на 1, как в примере ниже,диаграмма отображается правильно: 

  <XYPlot width={300} height={300}>
    <VerticalGridLines />
    <HorizontalGridLines />
    <XAxis />
    <YAxis />
    <MarkSeries
      onValueMouseOver={this._rememberValue}
      onValueMouseOut={this._forgetValue}
      data={[
        {x: 1, y: 3, color: 1},
        {x: 2, y: 5, color: 1},
        {x: 3, y: 1, color: 1}
      ]}
      colorRange={["#ff0000", "#0000ff"]}
    />
    {value ? <Hint value={value} /> : null}
  </XYPlot>

Вывод:

enter image description here

Другой рабочий пример:

Установка первого и третьего цветов точек данных на 0: 

  <XYPlot width={300} height={300}>
    <VerticalGridLines />
    <HorizontalGridLines />
    <XAxis />
    <YAxis />
    <MarkSeries
      onValueMouseOver={this._rememberValue}
      onValueMouseOut={this._forgetValue}
      data={[
        {x: 1, y: 3, color: 0},
        {x: 2, y: 5, color: 1},
        {x: 3, y: 1, color: 0}
      ]}
      colorRange={["#ff0000", "#0000ff"]}
    />
    {value ? <Hint value={value} /> : null}
  </XYPlot>

Вывод:

enter image description here

Непример работы:

Установка всех цветов точек данных на ноль не будет работать: 

  <XYPlot width={300} height={300}>
    <VerticalGridLines />
    <HorizontalGridLines />
    <XAxis />
    <YAxis />
    <MarkSeries
      onValueMouseOver={this._rememberValue}
      onValueMouseOut={this._forgetValue}
      data={[
        {x: 1, y: 3, color: 0},
        {x: 2, y: 5, color: 0},
        {x: 3, y: 1, color: 0}
      ]}
      colorRange={["#ff0000", "#0000ff"]}
    />
    {value ? <Hint value={value} /> : null}
  </XYPlot>

Вывод:

enter image description here

Это ошибка в реакции?Не уверен, что мне не хватает.

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

Вы можетеклонировать этот репозиторий git: https://github.com/willetvary/react-vis.git

Вот ветка для тестирования этого кода: Troubleshoot-xyplot-color-range-bug

Код находится в этом файле: showcase / axes / dynamic-hints.js

...