diff --git a/src/components/Heatmap.vue b/src/components/Heatmap.vue index 58a854024..299929fa1 100644 --- a/src/components/Heatmap.vue +++ b/src/components/Heatmap.vue @@ -64,7 +64,8 @@ export default Vue.component("heatmap", { separator: "___", lo: null, mid: null, - hi: null + hi: null, + alwaysHideTooltip: true, }; }, modules: { @@ -241,6 +242,9 @@ export default Vue.component("heatmap", { scaleLegendWrapper.innerHTML = scaleLegendContent; }, checkPosition(event) { + if (this.alwaysHideTooltip){ + return; + } let e = event; let rect = e.target.getBoundingClientRect(); @@ -333,7 +337,10 @@ export default Vue.component("heatmap", { this.renderData.columns.map((c) => { var div = document.createElement("div"); - var t = document.createTextNode(this.getPhenotypeDescription(c)); + let shortName = this.truncateColumn( + this.getPhenotypeDescription(c) + ); + var t = document.createTextNode(shortName); div.appendChild(t); div.setAttribute("style", "height: " + this.boxSize + "px;"); document @@ -593,7 +600,7 @@ export default Vue.component("heatmap", { if (!this.renderConfig.truncateColumns){ return longString; } - return longString.length <= 25 ? longString : `${longString.slice(0,25)}...`; + return longString.length <= 30 ? longString : `${longString.slice(0,30)}...`; }, getPhenotypeDescription(phenotypeName){ if (!!this.phenotypeMap[phenotypeName]){ diff --git a/src/components/NetworkGraph.vue b/src/components/NetworkGraph.vue index 979ac55cc..ea826a98e 100644 --- a/src/components/NetworkGraph.vue +++ b/src/components/NetworkGraph.vue @@ -98,7 +98,7 @@ export default Vue.component("NetworkGraph", { }, containerStyle() { return { - height: !this.isEmbed ? "80vh" : "300px", + height: !this.isEmbed ? "80vh" : "400px", width: "100%", position: this.isFullscreen ? "fixed" : "relative", top: this.isFullscreen ? "0" : "auto", diff --git a/src/views/PIGEAN/Phenotype/Template.vue b/src/views/PIGEAN/Phenotype/Template.vue index 330dbec7e..5b407c815 100644 --- a/src/views/PIGEAN/Phenotype/Template.vue +++ b/src/views/PIGEAN/Phenotype/Template.vue @@ -336,7 +336,7 @@ a.btn-outline-primary:hover { padding: 10px; } #mechanism-graph-inner { - padding-top: 200px; + padding-top: 20px; } /* .network-container >>> div.vis-network { border: none; diff --git a/src/views/PIGEAN/Phenotype/main.js b/src/views/PIGEAN/Phenotype/main.js index 714187ea5..eded52466 100644 --- a/src/views/PIGEAN/Phenotype/main.js +++ b/src/views/PIGEAN/Phenotype/main.js @@ -252,7 +252,7 @@ new Vue({ "construct the PheWAS and not to determine the factor weights.", heatmapConfig: { type: "heat map", - label: "Mechanisms", + label: "Mechanisms PheWAS", main: { field: "Z", label: "Z-score",