From 210291381d08eafa1d2d4de2a20fa0d4c60e8283 Mon Sep 17 00:00:00 2001
From: lorenasandoval88 <43822820+lorenasandoval88@users.noreply.github.com>
Date: Thu, 12 Sep 2024 14:47:20 -0400
Subject: [PATCH] Update ui.js

---
 sdk/ui.js | 57 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)

diff --git a/sdk/ui.js b/sdk/ui.js
index 16eb3d3..cddf27d 100644
--- a/sdk/ui.js
+++ b/sdk/ui.js
@@ -159,7 +159,64 @@ const ui = async function (targetDiv) {
         //     prsDt.pgs.category = category
         //     // if prs qc failes for one user, remove the connected pgs entry
         console.log("results: ", prsDt)
+      // plot-------------------------------------------------
       
+        var layout = {
+            showlegend: true,
+            autosize: false,
+            height: 900,
+            width: 800,
+            title: `PRS scores`,
+            yaxis: {
+                title: {
+                    text: "PRS"
+                },
+            },
+            xaxis: {
+                title: {
+                    text: "Users"
+                },
+            },
+            margin: {
+                b: 440
+            }
+        }
+
+        // reverse look up the PRS matrix to fill the traces
+        let traces = {}
+        data.PGS.map((x, i) => {
+            let arr = []
+            let idx = i
+            // let snpTxts2 = snpTxts.filter(x=> x.meta.split(/\r?\n|\r|\n/g)[0].slice(-4) > 2010)
+
+            data.my23.map(y => {
+                arr.push(data.PRS[idx])
+                idx += data.PGS.length
+            })
+            traces[data.PRS[i].pgsId] = arr
+        })
+        //console.log("traces",traces)
+        let plotData = Object.keys(traces).map((x, i) => {
+            let obj = {
+                y: traces[x].map(x => x.PRS),
+                x: traces[x].map(x => {
+                    let monthDay = x.my23meta.split(/\r?\n|\r|\n/g)[0].slice(-20, -14)
+                    let year = x.my23meta.split(/\r?\n|\r|\n/g)[0].slice(-4)
+                    // TODO add variation to data
+                    let phenotypeVariation = x.openSnp.id //[output.userPhenotype]["variation"]
+                    let xlabel = phenotypeVariation + "_" + x.openSnp.name + "_" + "ID" + "_" + x.my23Id + "_" + year + "_" + monthDay
+                    return xlabel
+                }),
+                mode: 'lines+markers',
+                opacity: 0.80,
+                hoverinfo: "y",
+                name: x + ": " + data.PGS[i].meta.variants_number + " variants",
+            }
+            return obj
+        })
+        plotDiv.innerHTML=''
+        plotly.newPlot(plotDiv, plotData, layout);
+    // })
     });
 
     // document.getElementById("prsButton").addEventListener("click", async (e) => {