@rcsb/rcsb-saguaro
Version:
RCSB 1D Feature Viewer
137 lines (136 loc) • 5.12 kB
JavaScript
import { select } from "d3-selection";
import { RcsbD3Constants } from "../RcsbD3Constants";
export class RcsbD3PinManager {
constructor() {
this.textElements = select(RcsbD3Constants.EMPTY);
this.lineElements = select(RcsbD3Constants.EMPTY);
this.circleElements = select(RcsbD3Constants.EMPTY);
}
plot(config) {
const elements = config.elements;
const xScale = config.xScale;
const yScale = config.yScale;
const height = config.height;
const color = config.color != undefined ? config.color : "#CCCCCC";
const radius = config.radius;
const labelShift = config.labelShift;
this.lineElements = elements.select(RcsbD3Constants.LINE);
this.textElements = elements.select(RcsbD3Constants.TEXT);
this.circleElements = elements.select(RcsbD3Constants.CIRCLE);
this.circleElements.attr(RcsbD3Constants.CX, (d) => {
var _a;
return (_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0;
})
.attr(RcsbD3Constants.CY, (d) => {
var _a;
let y = 0.5;
if (typeof d.value === "number") {
y = d.value;
}
return height - ((_a = yScale(y)) !== null && _a !== void 0 ? _a : 0);
})
.attr(RcsbD3Constants.R, radius)
.attr(RcsbD3Constants.FILL, (d) => {
if (typeof d.color === "string")
return d.color;
return color;
});
if (config.addLine) {
this.lineElements.attr(RcsbD3Constants.X1, (d) => {
var _a;
return (_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0;
})
.attr(RcsbD3Constants.Y1, (d) => {
return height;
})
.attr(RcsbD3Constants.X2, (d) => {
var _a;
return (_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0;
})
.attr(RcsbD3Constants.Y2, (d) => {
var _a;
let y = 0.5;
if (typeof d.value === "number") {
y = d.value;
}
return height - ((_a = yScale(y)) !== null && _a !== void 0 ? _a : 0);
});
}
else {
this.lineElements.remove();
}
if (config.addText) {
this.textElements.attr(RcsbD3Constants.FONT_SIZE, 12)
.attr(RcsbD3Constants.X, (d) => {
var _a;
return ((_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0) + 2.5 * labelShift;
})
.attr(RcsbD3Constants.Y, (d) => {
var _a;
var y = 0.5;
if (typeof d.value === "number") {
y = d.value;
}
return height - ((_a = yScale(y)) !== null && _a !== void 0 ? _a : 0) + 0.5 * labelShift;
})
.attr(RcsbD3Constants.TEXT_ANCHOR, "middle")
.attr(RcsbD3Constants.FILL, (d) => {
if (typeof d.color === "string")
return d.color;
return color;
})
.text((d) => {
return d.label || "";
});
}
else {
this.textElements.remove();
}
}
move(config) {
const xScale = config.xScale;
const yScale = config.yScale;
const height = config.height;
const labelShift = config.labelShift;
if (config.addLine) {
this.lineElements.attr(RcsbD3Constants.X1, (d) => {
var _a;
return (_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0;
})
.attr(RcsbD3Constants.Y1, (d) => {
return height;
})
.attr(RcsbD3Constants.X2, (d) => {
var _a;
return (_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0;
})
.attr(RcsbD3Constants.Y2, (d) => {
var _a;
var y = 0.5;
if (typeof d.value === "number") {
y = d.value;
}
return height - ((_a = yScale(y)) !== null && _a !== void 0 ? _a : 0);
});
}
this.circleElements.attr(RcsbD3Constants.CX, (d) => {
var _a;
return (_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0;
})
.attr(RcsbD3Constants.CY, (d) => {
var _a;
var y = 0.5;
if (typeof d.value === "number") {
y = d.value;
}
return height - ((_a = yScale(y)) !== null && _a !== void 0 ? _a : 0);
});
this.textElements.attr(RcsbD3Constants.X, (d) => {
var _a;
return ((_a = xScale(d.begin)) !== null && _a !== void 0 ? _a : 0) + 2.5 * labelShift;
})
.text((d) => {
return d.label || "";
});
}
}