Merge pull request #7 from p2m2/fix_chart

update version fixing chart
p2m2 · Feb 8, 2023 · c1603ba · c1603ba
2 parents a086ed2 + 627b7a1
commit c1603ba
Show file tree

Hide file tree

Showing 7 changed files with 875 additions and 812 deletions.
diff --git a/docs/main.js b/docs/main.js
diff --git a/docs/main.js.map b/docs/main.js.map
diff --git a/html/index.html b/html/index.html
@@ -10,7 +10,7 @@
         }
         .canvasChart {
             text-align: center;
-            width: 350px;
+            width: 450px;
         }
         .gridCanvas {
             display: grid;

diff --git a/js/src/main/scala/fr/inrae/p2m2/webapp/Chart.scala b/js/src/main/scala/fr/inrae/p2m2/webapp/Chart.scala
@@ -6,30 +6,54 @@ import scala.scalajs.js
 import scala.scalajs.js.annotation.JSGlobal
 import js.JSConverters._
 
+/**
+ * Documentation Chart.js
+ * https://www.chartjs.org/docs/latest/getting-started/
+ */
+
 @JSGlobal
 @js.native
 class Chart(ctx:dom.Element,obj:js.Dynamic) extends js.Object
 
+
 case object Chart {
-  def buildDataset(labels: Seq[String], values: Seq[Double], backgroundColor: Seq[String]): js.Dynamic = {
+  def buildDataset(title:String, labels: Seq[String],
+                   values_exp: Seq[Double],
+                   values_computed: Seq[Double]): js.Dynamic = {
 
     js.Dynamic.literal(
       `type` = "bar",
       data = js.Dynamic.literal(
         labels = labels.toJSArray, //js.Array("Red", "Blue", "Yellow", "Green", "Purple", "Orange"),
         datasets = js.Array(
           js.Dynamic.literal(
-            label = "Fractional mean 13C Enrichment",
-            `data` = values.toJSArray, //js.Array(12.5, 19.2, 3, 5, 2, 3),
-            backgroundColor = backgroundColor.toJSArray,
+            label = "Mean enrichment",
+            `data` = (values_exp++values_computed).toJSArray, //js.Array(12.5, 19.2, 3, 5, 2, 3),
+            backgroundColor =
+              (values_exp.indices.map(_=>"rgba(54, 162, 235, 0.2)")
+                  ++ values_computed.indices.map(_=>"rgba(255, 99, 132, 0.2)")).toJSArray,
             borderWidth = 1
-          )
+          ),
+/*
+          js.Dynamic.literal(
+            label = "calculated",
+            `data` = values_computed.toJSArray, //js.Array(12.5, 19.2, 3, 5, 2, 3),
+            backgroundColor = js.Array("rgba(255, 99, 132, 0.2)"),
+            borderWidth = 1
+          )*/
         ),
       ),
       options = js.Dynamic.literal(
         scales = js.Dynamic.literal(
           y = js.Dynamic.literal(beginAtZero = 0)
-        )
+        ),
+        plugins = js.Dynamic.literal(
+          title = js.Dynamic.literal(
+            display = true,
+            text = title,
+            color = "blue",
+          )
+        ),
       )
     )
   }

diff --git a/js/src/main/scala/fr/inrae/p2m2/webapp/PositionalCarbonMain.scala b/js/src/main/scala/fr/inrae/p2m2/webapp/PositionalCarbonMain.scala
@@ -19,19 +19,17 @@ object PositionalCarbonMain {
     canvas(id := idBarPlot)
 
 
-  def appendCanvas(idDivSample:String,idDiv:String,idCanvas:String, title:String) =
+  def appendCanvas(idDivSample:String,idDiv:String,idCanvas:String) =
     dom
       .document
       .getElementById(idDivSample)
       .append(
         div( id:=idDiv ,
           `class` := "canvasChart",
-          h2(title),
           buildCanvasBarPlot(idCanvas) )
           .render)
 
   def updateHtmlPage(content : String) = {
-    println(content)
     dom.document.getElementById(idMainDiv).innerHTML = div( id:=idMainDiv ).render.innerHTML
 
     Try(IsocorManagement.workflow(content.trim)) match {
@@ -59,17 +57,20 @@ object PositionalCarbonMain {
                   val title = metabolite
 
                   val labels = data.map(_._1)
-                  val values = data.map(_._2)
+                  val values_exp = data.filter(_._3).map(_._2)
+                  val values_calc = data.filter(!_._3).map(_._2)
 
-                  val backgroundColor = data.map {
-                    case (_, _, true) => "rgba(54, 162, 235, 0.2)"
-                    case (_, _, false) => "rgba(255, 99, 132, 0.2)"
-                  }
+                  //println("****************")
+                  //println(sample,metabolite)
+                  //println("EXP")
+                  //data.filter(_._3).foreach{ elt => println(elt)}
+                 // println("CALC")
+                 // values_calc.foreach{ elt => println(elt)}
 
-                  appendCanvas(idDivSample,idDiv, idCanvas, title)
+                  appendCanvas(idDivSample,idDiv, idCanvas)
 
                   val ctx = dom.document.getElementById(idCanvas)
-                  new Chart(ctx, Chart.buildDataset(labels, values, backgroundColor))
+                  new Chart(ctx, Chart.buildDataset(title,labels, values_exp,values_calc))
                 case _ => println("ok")
               }
           }
@@ -103,7 +104,7 @@ object PositionalCarbonMain {
               val content = reader.result.toString
               updateHtmlPage(content)
             }
-            println(s"reading ${files(0).name}")
+         //   println(s"reading ${files(0).name}")
             reader.readAsText(files(0));
           }
 

diff --git a/shared/src/main/scala/fr/inrae/p2m2/workflow/IsocorManagement.scala b/shared/src/main/scala/fr/inrae/p2m2/workflow/IsocorManagement.scala
@@ -13,7 +13,6 @@ case object IsocorManagement {
    //   .take(3) // debugging.....
       .map {
         case (k, listValues: Seq[IsocorValue]) if listValues.distinct.size > 1 =>
-          println(k, listValues.distinct.size)
           /* setting with experimental values     CX...CZ =>  value,FRAGMENT  ""*/
           val mapArrangementCarbon13: Map[String, Seq[(Double, Seq[String])]] =
             listValues
@@ -22,16 +21,11 @@ case object IsocorManagement {
                 case isocorVal => isocorVal.code -> Seq((isocorVal.meanEnrichment, Seq(isocorVal.fragment)))
               }.groupBy(_._1).map( x => x._1 -> x._2.flatMap(_._2))
 
-          println("================mapArrangementCarbon13============")
-          println(mapArrangementCarbon13)
-          println("============================")
           val (p, r) = ComputeCarbonMeanEnrichment.setMeanAndFragment(mapArrangementCarbon13)
 
-          val res = ComputeCarbonMeanEnrichment.computeValues(r, p)
-          val res2 = ComputeCarbonMeanEnrichment.computeValues(res, p)
-          val res3 = ComputeCarbonMeanEnrichment.computeValues(res2, p)
-          ComputeCarbonMeanEnrichment.printRes(res3)
-          k -> res3.flatMap( x => x._2.map( y => (x._1 + y.fragList.mkString("_"),y.mean,y.experimental)) ).toSeq
+          //val res = ComputeCarbonMeanEnrichment.computeValues(r, p)
+
+          k -> ComputeCarbonMeanEnrichment.computeValues(r, p).flatMap( x => x._2.map( y => (x._1 + y.fragList.mkString("_"),y.mean,y.experimental)) ).toSeq
         case (k, _) => println(k," => only 1 value") ;  k ->Seq()
       }
     }

diff --git a/shared/src/test/scala/fr/inrae/p2m2/tools/FixSerineTooMuchBar.scala b/shared/src/test/scala/fr/inrae/p2m2/tools/FixSerineTooMuchBar.scala
@@ -0,0 +1,26 @@
+package fr.inrae.p2m2.tools
+
+import utest.{TestSuite, Tests, test}
+
+/* fix bug with too much C2_m204 produced */
+object FixSerineTooMuchBar extends TestSuite {
+
+  def tests: Tests = Tests {
+    val m = Seq(
+      "C1C2" -> Seq((0.5229293502028365, Seq(""))),
+      "C2C3" -> Seq((0.48441859048103897, Seq("m204")),(0.506150883956903, Seq("m278"))),
+      "C1C3" -> Seq((0.5574118261363693, Seq())),
+      "C2" -> Seq((0.5100469893183011, Seq())),
+    ).toMap
+
+    val (p, r) = ComputeCarbonMeanEnrichment.setMeanAndFragment(m)
+    val res = ComputeCarbonMeanEnrichment.computeValues(r, p)
+    val res2 = ComputeCarbonMeanEnrichment.computeValues(res, p)
+    res2.filter(_._1 == "C2").values.foreach(
+      aa => aa.foreach(
+        bb => println(bb)
+      )
+    )
+  }
+
+}