in packages/charts/src/chart_types/heatmap/layout/viewmodel/viewmodel.ts [204:290]
color: colorToRgba(heatmapTheme.cell.border.stroke),
width: heatmapTheme.cell.border.strokeWidth,
},
value: d.value,
visible: !isValueInRanges(d.value, bandsToHide),
formatted: formattedValue,
fontSize,
textColor: fillTextColor(background.fallbackColor, cellBackgroundColor, background.color).color.keyword,
});
return acc;
}, new Map());
const getScaledSMValue = (value: number | string, scale: 'horizontal' | 'vertical') => {
return hasSMDomain(smScales[scale]) ? smScales[scale].scale(value) : 0;
};
const getPanelPointCoordinate = (value: Pixels, scale: 'horizontal' | 'vertical') => {
const category = smScales[scale].invert(value) ?? '';
const panelOffset = getScaledSMValue(category, scale);
const invertedScale = scale === 'horizontal' ? xInvertedScale : yInvertedScale;
return {
category,
panelOffset,
panelPixelValue: value - panelOffset,
panelValue: invertedScale(value - panelOffset),
};
};
const getPanelPointCoordinates = (x: Pixels, y: Pixels) => {
const {
category: v,
panelValue: panelY,
panelOffset: panelOffsetY,
} = getPanelPointCoordinate(y - chartDimensions.top, 'vertical');
const {
category: h,
panelValue: panelX,
panelOffset: panelOffsetX,
} = getPanelPointCoordinate(x - chartDimensions.left, 'horizontal');
return {
x: panelX,
y: panelY,
v,
h,
panelOffsetY,
panelOffsetX,
};
};
// TODO: Make this method more precise to avoid Y title
const isPointWithinYLabelArea = (x: Pixels, y: Pixels) =>
x > chartMargins.left &&
x < chartDimensions.left - chartPaddings.left &&
y > chartDimensions.top &&
y < chartDimensions.top + chartDimensions.height;
/**
* Returns the corresponding x & y values of grid cell from the x & y positions
* @param x
* @param y
*/
const pickGridCell = (x: Pixels, y: Pixels): GridCell | undefined => {
if (x < chartDimensions.left || y < chartDimensions.top) return undefined;
if (x > chartDimensions.width + chartDimensions.left || y > chartDimensions.top + chartDimensions.height)
return undefined;
const xValue = xInvertedScale(x - chartDimensions.left);
const yValue = yInvertedScale(y);
if (xValue === undefined || yValue === undefined) return undefined;
return { x: xValue, y: yValue };
};
/**
* Returns selected elements based on coordinates.
* @param x
* @param y
*/
const pickQuads = (x: Pixels, y: Pixels): Array<Cell> | TextBox => {
if (isPointWithinYLabelArea(x, y)) {
// look up for a Y axis elements
const { y: yLabelKey } = getPanelPointCoordinates(x, y);
const yLabelValue = textYValues.find((v) => v.value === yLabelKey);
if (yLabelValue) {