function getLines(props) {
  const {
    animation,
    brushFilters,
    colorRange,
    domains,
    data,
    style,
    showMarks
  } = props;
  const scales = domains.reduce((acc, {domain, name}) => {
    acc[name] = scaleLinear()
      .domain(domain)
      .range([0, 1]);
    return acc;
  }, {});
  // const

  return data.map((row, rowIndex) => {
    let withinFilteredRange = true;
    const mappedData = domains.map(domain => {
      const {getValue, name} = domain;

      // watch out! Gotcha afoot
      // yVal after being scale is in [0, 1] range
      const yVal = scales[name](getValue ? getValue(row) : row[name]);
      const filter = brushFilters[name];
      // filter value after being scale back from pixel space is also in [0, 1]
      if (filter && (yVal < filter.min || yVal > filter.max)) {
        withinFilteredRange = false;
      }
      return {x: name, y: yVal};
    });
    const selectedName = `${predefinedClassName}-line`;
    const unselectedName = `${selectedName} ${predefinedClassName}-line-unselected`;
    const lineProps = {
      animation,
      className: withinFilteredRange ? selectedName : unselectedName,
      key: `${rowIndex}-polygon`,
      data: mappedData,
      color: row.color || colorRange[rowIndex % colorRange.length],
      style: {...style.lines, ...(row.style || {})}
    };
    if (!withinFilteredRange) {
      lineProps.style = {
        ...lineProps.style,
        ...style.deselectedLineStyle
      };
    }
    return showMarks ? (
      <LineMarkSeries {...lineProps} />
    ) : (
      <LineSeries {...lineProps} />
    );
  });
}
Generate the actual lines to be plotted
@param {Object} props
 - props.animation {Boolean}
 - props.data {Array} array of object specifying what values are to be plotted
 - props.domains {Array} array of object specifying the way each axis is to be plotted
 - props.style {object} style object for the whole chart
 - props.showMarks {Bool} whether or not to use the line mark series
@return {Array} the plotted axis components