in modules/monochrome/src/metric-card/chart.js [194:246]
_renderSeries() {
const {data, dataFilter, highlightSeries, getX, getY0, getY, xDomain} = this.props;
const areas = [];
const lines = [];
Object.keys(data).forEach(key => {
if (!dataFilter(key)) {
return;
}
// Temporary patch until vis-gl fixes issue with rendering data outside of domain
// https://github.com/uber/react-vis/issues/627
const datums = xDomain
? data[key].filter(point => {
const x = getX(point);
return x >= xDomain[0] && x <= xDomain[1];
})
: data[key];
if (!datums.length) {
return;
}
const isArea = Number.isFinite(getY0(datums[0]));
const Type = isArea ? AreaSeries : LineSeries;
const color = this._getColor(key);
const series = (
<Type
key={`value-${key}-line`}
data={datums}
getX={getX}
getY={getY}
getY0={getY0}
color={color}
fill={color}
strokeWidth={highlightSeries === key ? 4 : 2}
onNearestX={this.props.onNearestX.bind(this, key)}
onSeriesMouseOver={() => this.props.onSeriesMouseOver(key)}
onSeriesMouseOut={() => this.props.onSeriesMouseOut(key)}
/>
);
if (isArea) {
areas.push(series);
} else {
lines.push(series);
}
});
// Render lines on top
return areas.concat(lines);
}