Skip to content

Commit

Permalink
[heatmap] rm bin.x0. fixes #474
Browse files Browse the repository at this point in the history
  • Loading branch information
hshoff committed Jul 9, 2019
1 parent 33edb48 commit 6f2da5a
Showing 1 changed file with 86 additions and 86 deletions.
172 changes: 86 additions & 86 deletions packages/vx-heatmap/src/heatmaps/HeatmapRect.js
Original file line number Diff line number Diff line change
@@ -1,86 +1,86 @@
import React from 'react';
import cx from 'classnames';
import PropTypes from 'prop-types';
import { Group } from '@vx/group';

HeatmapRect.propTypes = {
data: PropTypes.array,
top: PropTypes.number,
left: PropTypes.number,
binWidth: PropTypes.number,
binHeight: PropTypes.number,
x0: PropTypes.number,
gap: PropTypes.number,
xScale: PropTypes.func,
yScale: PropTypes.func,
colorScale: PropTypes.func,
opacityScale: PropTypes.func,
bins: PropTypes.func,
count: PropTypes.func,
className: PropTypes.string,
children: PropTypes.func
};

export default function HeatmapRect({
className,
top,
left,
data,
binWidth,
binHeight,
x0 = 0,
gap = 1,
xScale,
yScale,
colorScale = d => undefined,
opacityScale = d => 1,
bins = d => d.bins,
count = d => d.count,
children,
...restProps
}) {
const width = binWidth - gap;
const height = binHeight - gap;
const heatmap = data.map((datum, column) => {
const x = xScale(column);
return bins(datum).map((bin, row) => {
const countValue = count(bin);
return {
bin,
row,
column,
datum,
width,
height,
gap,
count: countValue,
x: x + x0,
y: yScale(row) + gap,
color: colorScale(countValue),
opacity: opacityScale(countValue)
};
});
});
if (children) return children(heatmap);
return (
<Group className="vx-heatmap-rects" top={top} left={left}>
{heatmap.map((_bins, column) => {
return _bins.map(bin => {
return (
<rect
key={`heatmap-tile-rect-${bin.row}-${bin.column}`}
className={cx('vx-heatmap-rect', className)}
width={bin.width}
height={bin.height}
x={bin.x + bin.x0}
y={bin.y}
fill={bin.color}
fillOpacity={bin.opacity}
{...restProps}
/>
);
});
})}
</Group>
);
}
import React from 'react';
import cx from 'classnames';
import PropTypes from 'prop-types';
import { Group } from '@vx/group';

HeatmapRect.propTypes = {
data: PropTypes.array,
top: PropTypes.number,
left: PropTypes.number,
binWidth: PropTypes.number,
binHeight: PropTypes.number,
x0: PropTypes.number,
gap: PropTypes.number,
xScale: PropTypes.func,
yScale: PropTypes.func,
colorScale: PropTypes.func,
opacityScale: PropTypes.func,
bins: PropTypes.func,
count: PropTypes.func,
className: PropTypes.string,
children: PropTypes.func
};

export default function HeatmapRect({
className,
top,
left,
data,
binWidth,
binHeight,
x0 = 0,
gap = 1,
xScale,
yScale,
colorScale = d => undefined,
opacityScale = d => 1,
bins = d => d.bins,
count = d => d.count,
children,
...restProps
}) {
const width = binWidth - gap;
const height = binHeight - gap;
const heatmap = data.map((datum, column) => {
const x = xScale(column);
return bins(datum).map((bin, row) => {
const countValue = count(bin);
return {
bin,
row,
column,
datum,
width,
height,
gap,
count: countValue,
x: x + x0,
y: yScale(row) + gap,
color: colorScale(countValue),
opacity: opacityScale(countValue)
};
});
});
if (children) return children(heatmap);
return (
<Group className="vx-heatmap-rects" top={top} left={left}>
{heatmap.map((_bins, column) => {
return _bins.map(bin => {
return (
<rect
key={`heatmap-tile-rect-${bin.row}-${bin.column}`}
className={cx('vx-heatmap-rect', className)}
width={bin.width}
height={bin.height}
x={bin.x}
y={bin.y}
fill={bin.color}
fillOpacity={bin.opacity}
{...restProps}
/>
);
});
})}
</Group>
);
}

0 comments on commit 6f2da5a

Please sign in to comment.