jingrow/charts
1
0
Fork 0
Code Pull Requests Activity

Merge pull request #285 from scmmishra/heatmap-radius

Browse Source 
feat: allow corner radius for heatmap
This commit is contained in:
Shivam Mishra 2020-05-09 17:55:07 +05:30 committed by GitHub
commit 1834ff71bd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/js/charts/Heatmap.js
View File

@ -98,6 +98,7 @@ export default class Heatmap extends BaseChart {
colWidth: COL_WIDTH,
rowHeight: ROW_HEIGHT,
squareSize: HEATMAP_SQUARE_SIZE,
radius: this.rawChartArgs.radius || 0,
xTranslate: s.domainConfigs
.filter((config, j) => j < i)
.map(config => config.cols.length - lessCol)

4
src/js/objects/ChartComponents.js
View File

@ -252,7 +252,7 @@ let componentConfigs = {
heatDomain: {
layerClass: function() { return 'heat-domain domain-' + this.constants.index; },
makeElements(data) {
let {index, colWidth, rowHeight, squareSize, xTranslate} = this.constants;
let {index, colWidth, rowHeight, squareSize, radius, xTranslate} = this.constants;
let monthNameHeight = -12;
let x = xTranslate, y = 0;
@ -275,7 +275,7 @@ let componentConfigs = {
'data-value': day.dataValue,
'data-day': i
};
let square = heatSquare('day', x, y, squareSize, day.fill, data);
let square = heatSquare('day', x, y, squareSize, radius, day.fill, data);
this.serializedSubDomains.push(square);
}
y += rowHeight;

7
src/js/utils/draw.js
View File

@ -190,13 +190,14 @@ export function percentageBar(x, y, width, height,
return createSVG("rect", args);
}
export function heatSquare(className, x, y, size, fill='none', data={}) {
export function heatSquare(className, x, y, size, radius, fill='none', data={}) {
let args = {
className: className,
x: x,
y: y,
width: size,
height: size,
rx: radius,
fill: fill
};
@ -322,7 +323,7 @@ function makeHoriLine(y, label, x1, x2, options={}) {
if(!options.stroke) options.stroke = BASE_LINE_COLOR;
if(!options.lineType) options.lineType = '';
if (options.shortenNumbers) label = shortenLargeNumber(label);
let className = 'line-horizontal ' + options.className +
(options.lineType === "dashed" ? "dashed": "");
@ -583,7 +584,7 @@ export function getPaths(xList, yList, color, options={}, meta={}) {
// Spline
if (options.spline)
pointsStr = getSplineCurvePointsStr(xList, yList);
let path = makePath("M"+pointsStr, 'line-graph-path', color);
// HeatLine