@jbrowse/plugin-linear-genome-view
Version:
JBrowse 2 linear genome view
20 lines (19 loc) • 1.3 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { calculateFloatingLabelPosition, } from "../components/util.js";
export function SvgFloatingLabels({ featureLabels, offsetPx, viewWidth, }) {
const elements = [];
for (const [key, { leftPx, topPx, totalFeatureHeight, floatingLabels, featureWidth },] of featureLabels.entries()) {
const featureVisualBottom = topPx + totalFeatureHeight;
const featureRightPx = leftPx + featureWidth;
for (const [i, { text, relativeY, color, textWidth, isOverlay },] of floatingLabels.entries()) {
const y = featureVisualBottom + relativeY;
const x = calculateFloatingLabelPosition(leftPx, featureRightPx, textWidth, offsetPx);
if (x < 0 || x > viewWidth) {
continue;
}
const fontSize = 11;
elements.push(_jsxs("g", { transform: `translate(${x}, ${y})`, children: [isOverlay ? (_jsx("rect", { x: -1, y: 0, width: textWidth + 2, height: fontSize + 1, fill: "rgba(255, 255, 255, 0.8)" })) : null, _jsx("text", { x: 0, y: fontSize, fontSize: fontSize, fill: color, style: { pointerEvents: 'none' }, children: text })] }, `${key}-${i}`));
}
}
return _jsx(_Fragment, { children: elements });
}