in src/ColorHeatmap.js [157:206]
render() {
const {
data,
xScale,
yScale,
value,
x,
xEnd,
y,
yEnd,
interpolator,
rectStyle,
rectClassName,
} = this.props;
const valueAccessor = makeAccessor2(value);
let colorScale;
if (this.props.colorScale) {
colorScale = this.props.colorScale;
} else {
const valueDomain =
this.props.valueDomain || domainFromData(data, valueAccessor);
const colors =
this.props.colors ||
(valueDomain.length === 2
? ['#000000', '#ffffff']
: times(valueDomain.length, schemeCategory10().domain(range(10))));
colorScale = makeColorScale(valueDomain, colors, interpolator);
}
return (
<g className="rct-color-heatmap-chart" aria-hidden="true">
{data.map((d, i) => {
const color = colorScale(valueAccessor(d));
const style = { ...getValue(rectStyle, d, i), fill: color };
const className = `${getValue(rectClassName, d, i)}`;
const key = `heatmap-rect-${i}`;
return (
<RangeRect
x={getValue(x, d, i)}
xEnd={getValue(xEnd, d, i)}
y={getValue(y, d, i)}
yEnd={getValue(yEnd, d, i)}
{...{ xScale, yScale, style, className, key }}
/>
);
})}
</g>
);
}