Commit 6a11efd3 authored by Lukas Pravda's avatar Lukas Pravda
Browse files

change font for ligand node texts

parent 7cc1645a
......@@ -58,6 +58,8 @@ class Visualization {
.attr('width', '100%')
.attr('height', '100%');
this.addMarkers();
this.canvas = this.svg.append('g').attr('id', 'vis-root');
this.linksRoot = this.canvas.append('g').attr('id', 'links');
this.depictionRoot = this.canvas.append('g').attr('id', 'depiction');
......@@ -692,11 +694,11 @@ class Visualization {
.filter((x: Model.InteractionNode) => !x.residue.isLigand)
.forEach((x: Model.InteractionNode) => {
let links = this.presentBindingSite.links.filter((y: Model.LigandResidueLink) => y.containsNode(x) && y.getLinkClass() !== 'hydrophobic');
links = links.length == 0 ? this.presentBindingSite.links.filter((y: Model.LigandResidueLink) => y.containsNode(x)) : links;
let atom_names = links
.map((y: Model.LigandResidueLink) => [].concat.apply([], y.interaction.map(z => z.sourceAtoms)));
let concated = [].concat.apply([], atom_names);
let position: Vector2D = this.depiction.getInitalNodePosition(concated);
......@@ -835,15 +837,15 @@ class Visualization {
.attr('transform', () => `translate(${x.x},${x.y}) scale(${x.scale})`);
let otherNodes = [x];
this.links.filter((l: Model.Link) => l.containsNode(x)).each((lnk: Model.Link) => {
this.links.filter((l: Model.Link) => l.containsNode(x)).each((lnk: Model.Link) => {
let otherNode = lnk.getOtherNode(x);
otherNodes.push(otherNode);
});
});
this.nodes
.filter((node: Model.InteractionNode) => !otherNodes.includes(node))
.attr('opacity', 0.4);
this.links
.filter((l: Model.Link) => !l.containsNode(x))
//.transition()
......@@ -905,6 +907,10 @@ class Visualization {
private addMarkers() {
let defs = this.svg.append('defs')
defs
.append('style')
.text("@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@200&display=swap');");
// proper background for depiction tspans
// gracefully copied from: https://stackoverflow.com/questions/15500894/background-color-of-text-in-svg
let filter = defs.append('filter')
......@@ -926,7 +932,6 @@ class Visualization {
.attr("refY", 3)
.attr("orient", "auto")
.attr('markerUnits', 'strokeWidth')
.append('path')
.attr('d', 'M22.245,4.015c0.313,0.313,0.313,0.826,0,1.139l-6.276,6.27c-0.313,0.312-0.313,0.826,0,1.14l6.273,6.272 c0.313,0.313,0.313,0.826,0,1.14l-2.285,2.277c-0.314,0.312-0.828,0.312-1.142,0l-6.271-6.271c-0.313-0.313-0.828-0.313-1.141,0 l-6.276,6.267c-0.313,0.313-0.828,0.313-1.141,0l-2.282-2.28c-0.313-0.313-0.313-0.826,0-1.14l6.278-6.269 c0.313-0.312,0.313-0.826,0-1.14L1.709,5.147c-0.314-0.313-0.314-0.827,0-1.14l2.284-2.278C4.308,1.417,4.821,1.417,5.135,1.73 L11.405,8c0.314,0.314,0.828,0.314,1.141,0.001l6.276-6.267c0.312-0.312,0.826-0.312,1.141,0L22.245,4.015z')
.attr('style', 'stroke:#FF5050;stroke-width:3px;');
......
......@@ -93,7 +93,7 @@
.pdb-lig-env-svg-node text {
cursor: inherit;
font-family: sans-serif;
font-family: 'Exo 2', sans-serif;
stroke: black !important;
fill: black !important;
}
......@@ -101,13 +101,13 @@
.pdb-lig-env-svg-node text tspan:first-child {
cursor: inherit;
font-weight: 100;
font-size: 1em;
font-size: 1.1em;
}
.pdb-lig-env-svg-node text tspan:nth-child(2) {
cursor: inherit;
font-weight: lighter;
font-size: 0.75em;
font-size: 0.8em;
}
.pdb-lig-env-svg-ligand-res {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment