in src/FunnelChart.js [101:150]
render() {
const {
data,
xScale,
yScale,
color,
pathStyle,
x,
y,
horizontal,
pathClassName,
} = this.props;
const funnelArea = area();
if (horizontal) {
funnelArea
.x0((d, i) => xScale(-getValue(x, d, i)))
.x1((d, i) => xScale(getValue(x, d, i)))
.y((d, i) => yScale(getValue(y, d, i)));
} else {
funnelArea
.x((d, i) => xScale(getValue(x, d, i)))
.y0((d, i) => yScale(-getValue(y, d, i)))
.y1((d, i) => yScale(getValue(y, d, i)));
}
const colors = scaleOrdinal(schemeCategory10).domain(range(10));
return (
<g className="rct-funnel-chart" aria-hidden="true">
{data.map((d, i) => {
if (i === 0) return null;
const pathStr = funnelArea([data[i - 1], d]);
const fill = color ? getValue(color, d, i) : colors(i - 1);
let style = getValue(pathStyle, d, i);
style = defaults({}, style, { fill, stroke: 'transparent' });
return (
<path
d={pathStr}
className={`${getValue(pathClassName, d, i) || ''}`}
style={style}
key={i}
/>
);
})}
</g>
);
}