Ввод строки D3.определенный в TypeScript

#typescript #d3.js

#typescript #d3.js

Вопрос:

Я рисую линию, которая может содержать пробелы line.defined() , но я не могу понять, как ее правильно вводить. Мой график отображается как ожидалось. Вот код:

 interface XYPoint {
  x: number;
  y: number;
}

interface XYPointNullable {
  x: number;
  y: number | null;
}

const lineIWantToDraw: XYPointNullable[] = [{ x: 1, y: 1 }, { x: 2, y: 2 }, { x: 3, y: null }];

const createLine = line<XYPointNullable>() // <- type error here
  .defined(d => d.y !== null)
  .x(d => d.x)
  .y(d => d.y);

  

С помощью приведенного выше кода я получаю сообщение об ошибке Type 'null' is not assignable to type 'number' .

Если я ввожу строку fn как XYPoint , я получаю сообщение об ошибке Argument of type 'XYPointNullable[]' is not assignable to parameter of type 'XYPoint[]' при вызове функции.

Я пропустил что-то очевидное?

Заранее спасибо за любые предложения!

Ответ №1:

Поскольку вы знаете, что d => d.y это всегда возвращает число, вы можете использовать его как таковое:

 interface XYPointNullable {
  x: number;
  y: number | null;
}

line<XYPointNullable>()
  .defined(d => d.y !== null)
  .x(d => d.x)
  .y(d => d.y as number);
  

Эта игровая площадка не дала мне никаких ошибок с этим.