Paired boxplots with connections

Boxplot graphs, also known as box and whisker plots, offer a compelling way to visually display the distribution and summary statistics of a dataset. They present key descriptive statistics such as median, quartiles, and potential outliers, making them ideal for comparing data across different groups or identifying unusual data points. Understanding boxplot graphs is essential for data analysis. These graphs quickly reveal central tendency, spread, and skewness, providing valuable insights for decision-making. Their effectiveness in visualizing data makes them a staple in various fields, from finance and healthcare to engineering and social sciences.


Economist GGPlot Excel Paul Tol Black And White Solarized Stata Tableau Wall Street CanvasXpress
<html>

  <head>
    <!-- Include the CanvasXpress library in your HTML file -->
    <link rel="stylesheet" href="https://www.canvasxpress.org/dist/canvasXpress.css" type="text/css"/>
    <script src="https://www.canvasxpress.org/dist/canvasXpress.min.js"></script>
  </head>

  <body>

    <!-- Create a canvas element for the chart with the desired dimensions -->
    <div>
      <canvas id="canvasId" width="600" height="600"></canvas>
    </div>


    <!-- Create a script to initialize the chart -->
    <script>

      // Use a data frame (2D-array) for the graph
      var data = 

      // Create the configuration for the graph
      var config = {
         "graphType" : "Boxplot",
         "graphOrientation" : "vertical",
         "theme" : "GGPlot",
         "groupingFactors" : [
            "Condition"
         ],
         "segregateSamplesBy" : [
            "Cohort"
         ],
         "xAxis" : [
            "Biomarker"
         ],
         "smpTitle" : "Biomarker",
         "xAxisTitle" : "Biomarker level",
         "connectBy" : "Patient",
         "connectByPointColor" : true,
         "connectByWidth" : 1,
         "colorBy" : "updown",
         "colorKey" : {
            "updown" : {
               "up" : "rgb(224,130,20)",
               "down" : "rgb(58,102,160)"
            }
         },
         "showBoxplotOriginalData" : true,
         "showLegend" : true,
         "layoutTopology" : "1X2",
         "title" : "Paired boxplots with per-patient connections",
         "decorations" : {
            "text" : [
               {
                  "value" : 11.5,
                  "label" : "p<0.0001",
                  "color" : "rgb(0,0,0)",
                  "panel" : 1,
                  "smpCenter" : true,
                  "labelScaleFontFactor" : 0.9,
                  "preTransformed" : true
               },
               {
                  "value" : 11.5,
                  "label" : "p=0.022",
                  "color" : "rgb(0,0,0)",
                  "panel" : 2,
                  "smpCenter" : true,
                  "labelScaleFontFactor" : 0.9,
                  "preTransformed" : true
               }
            ]
         }
      }

      // Event used to create graph (optional)
      var events = false

      // Call the CanvasXpress function to create the graph
      var cX = new CanvasXpress("canvasId", data, config, events);

    </script>

  </body>

</html>
<html>

  <head>
    <!-- Include the CanvasXpress library in your HTML file -->
    <link rel="stylesheet" href="https://www.canvasxpress.org/dist/canvasXpress.css" type="text/css"/>
    <script src="https://www.canvasxpress.org/dist/canvasXpress.min.js"></script>
  </head>

  <body>

    <!-- Create a canvas element for the chart with the desired dimensions -->
    <div>
      <canvas id="canvasId" width="600" height="600"></canvas>
    </div>


    <!-- Create a script to initialize the chart -->
    <script>

      // Create the data for the graph
      var data = {
         "y" : {
            "vars" : [
               "Biomarker"
            ],
            "smps" : [
               "Var1",
               "Var2",
               "Var3",
               "Var4",
               "Var5",
               "Var6",
               "Var7",
               "Var8",
               "Var9",
               "Var10",
               "Var11",
               "Var12",
               "Var13",
               "Var14",
               "Var15",
               "Var16",
               "Var17",
               "Var18",
               "Var19",
               "Var20",
               "Var21",
               "Var22",
               "Var23",
               "Var24",
               "Var25",
               "Var26",
               "Var27",
               "Var28",
               "Var29",
               "Var30",
               "Var31",
               "Var32",
               "Var33",
               "Var34",
               "Var35",
               "Var36",
               "Var37",
               "Var38",
               "Var39",
               "Var40",
               "Var41",
               "Var42",
               "Var43",
               "Var44",
               "Var45",
               "Var46",
               "Var47",
               "Var48",
               "Var49",
               "Var50",
               "Var51",
               "Var52",
               "Var53",
               "Var54",
               "Var55",
               "Var56",
               "Var57",
               "Var58",
               "Var59",
               "Var60",
               "Var61",
               "Var62",
               "Var63",
               "Var64",
               "Var65",
               "Var66",
               "Var67",
               "Var68",
               "Var69",
               "Var70",
               "Var71",
               "Var72",
               "Var73",
               "Var74",
               "Var75",
               "Var76",
               "Var77",
               "Var78",
               "Var79",
               "Var80",
               "Var81",
               "Var82",
               "Var83",
               "Var84",
               "Var85",
               "Var86",
               "Var87",
               "Var88",
               "Var89",
               "Var90",
               "Var91",
               "Var92",
               "Var93",
               "Var94",
               "Var95",
               "Var96",
               "Var97",
               "Var98",
               "Var99",
               "Var100"
            ],
            "data" : [
               [
                  10.74,
                  9.49,
                  6.56,
                  5.77,
                  7.17,
                  6.24,
                  7.51,
                  5.32,
                  6.84,
                  5.21,
                  6.86,
                  4.77,
                  8.9,
                  8.07,
                  7.86,
                  6.55,
                  8.18,
                  6.72,
                  10.63,
                  8.89,
                  8.43,
                  6.58,
                  11.26,
                  10.66,
                  10.74,
                  8.45,
                  8.39,
                  6.87,
                  10.28,
                  9.13,
                  8.56,
                  8.14,
                  6.93,
                  4.97,
                  7.63,
                  6,
                  7.99,
                  5.54,
                  9.19,
                  7.47,
                  9.01,
                  7.29,
                  8.85,
                  8.53,
                  9.57,
                  8.64,
                  6.33,
                  5.01,
                  9.53,
                  8.87,
                  7.68,
                  6.32,
                  7.99,
                  6.98,
                  8.44,
                  7.69,
                  10.05,
                  9.7,
                  8.87,
                  10.51,
                  8.58,
                  8.55,
                  6.12,
                  5.82,
                  8.38,
                  8.11,
                  8.2,
                  7.58,
                  6.92,
                  5.99,
                  8.09,
                  7.54,
                  8.19,
                  7.61,
                  8.65,
                  8.11,
                  8.85,
                  7.12,
                  8.38,
                  8.55,
                  9.33,
                  10.34,
                  8.92,
                  8.11,
                  9.38,
                  9.58,
                  9.51,
                  9.4,
                  8.84,
                  9.22,
                  8.52,
                  7.76,
                  6.89,
                  7.49,
                  7.26,
                  5.73,
                  6.96,
                  6.31,
                  6.03,
                  5.61
               ]
            ]
         },
         "x" : {
            "Patient" : [
               "P1_1",
               "P1_1",
               "P1_2",
               "P1_2",
               "P1_3",
               "P1_3",
               "P1_4",
               "P1_4",
               "P1_5",
               "P1_5",
               "P1_6",
               "P1_6",
               "P1_7",
               "P1_7",
               "P1_8",
               "P1_8",
               "P1_9",
               "P1_9",
               "P1_10",
               "P1_10",
               "P1_11",
               "P1_11",
               "P1_12",
               "P1_12",
               "P1_13",
               "P1_13",
               "P1_14",
               "P1_14",
               "P1_15",
               "P1_15",
               "P1_16",
               "P1_16",
               "P1_17",
               "P1_17",
               "P1_18",
               "P1_18",
               "P1_19",
               "P1_19",
               "P1_20",
               "P1_20",
               "P1_21",
               "P1_21",
               "P1_22",
               "P1_22",
               "P1_23",
               "P1_23",
               "P1_24",
               "P1_24",
               "P1_25",
               "P1_25",
               "P2_1",
               "P2_1",
               "P2_2",
               "P2_2",
               "P2_3",
               "P2_3",
               "P2_4",
               "P2_4",
               "P2_5",
               "P2_5",
               "P2_6",
               "P2_6",
               "P2_7",
               "P2_7",
               "P2_8",
               "P2_8",
               "P2_9",
               "P2_9",
               "P2_10",
               "P2_10",
               "P2_11",
               "P2_11",
               "P2_12",
               "P2_12",
               "P2_13",
               "P2_13",
               "P2_14",
               "P2_14",
               "P2_15",
               "P2_15",
               "P2_16",
               "P2_16",
               "P2_17",
               "P2_17",
               "P2_18",
               "P2_18",
               "P2_19",
               "P2_19",
               "P2_20",
               "P2_20",
               "P2_21",
               "P2_21",
               "P2_22",
               "P2_22",
               "P2_23",
               "P2_23",
               "P2_24",
               "P2_24",
               "P2_25",
               "P2_25"
            ],
            "Condition" : [
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12",
               "Baseline",
               "Week 12"
            ],
            "Cohort" : [
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort A",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B",
               "Cohort B"
            ],
            "updown" : [
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "up",
               "up",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down",
               "up",
               "up",
               "up",
               "up",
               "down",
               "down",
               "up",
               "up",
               "down",
               "down",
               "up",
               "up",
               "down",
               "down",
               "up",
               "up",
               "down",
               "down",
               "down",
               "down",
               "down",
               "down"
            ],
            "xpos" : [
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2,
               1,
               2
            ]
         }
      }

      // Create the configuration for the graph
      var config = {
         "graphType" : "Boxplot",
         "graphOrientation" : "vertical",
         "theme" : "GGPlot",
         "groupingFactors" : [
            "Condition"
         ],
         "segregateSamplesBy" : [
            "Cohort"
         ],
         "xAxis" : [
            "Biomarker"
         ],
         "smpTitle" : "Biomarker",
         "xAxisTitle" : "Biomarker level",
         "connectBy" : "Patient",
         "connectByPointColor" : true,
         "connectByWidth" : 1,
         "colorBy" : "updown",
         "colorKey" : {
            "updown" : {
               "up" : "rgb(224,130,20)",
               "down" : "rgb(58,102,160)"
            }
         },
         "showBoxplotOriginalData" : true,
         "showLegend" : true,
         "layoutTopology" : "1X2",
         "title" : "Paired boxplots with per-patient connections",
         "decorations" : {
            "text" : [
               {
                  "value" : 11.5,
                  "label" : "p<0.0001",
                  "color" : "rgb(0,0,0)",
                  "panel" : 1,
                  "smpCenter" : true,
                  "labelScaleFontFactor" : 0.9,
                  "preTransformed" : true
               },
               {
                  "value" : 11.5,
                  "label" : "p=0.022",
                  "color" : "rgb(0,0,0)",
                  "panel" : 2,
                  "smpCenter" : true,
                  "labelScaleFontFactor" : 0.9,
                  "preTransformed" : true
               }
            ]
         }
      }

      // Event used to create graph (optional)
      var events = false

            // Call the CanvasXpress function to create the graph
      var cX = new CanvasXpress("canvasId", data, config, events);

    </script>

  </body>

</html>
library(canvasXpress)
y=read.table("https://www.canvasxpress.org/data/r/cX-boxplot24-dat.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
x=read.table("https://www.canvasxpress.org/data/r/cX-boxplot24-smp.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
canvasXpress(
data=y,
smpAnnot=x,
colorBy="updown",
colorKey=list(updown=list(down="rgb(58,102,160)", up="rgb(224,130,20)")),
connectBy="Patient",
connectByPointColor=TRUE,
connectByWidth=1,
decorations=list(text=list(list(color="rgb(0,0,0)", label="p<0.0001", labelScaleFontFactor=0.9, panel=1, preTransformed="True", smpCenter="True", value=11.5), list(color="rgb(0,0,0)", label="p=0.022", labelScaleFontFactor=0.9, panel=2, preTransformed="True", smpCenter="True", value=11.5))),
graphOrientation="vertical",
graphType="Boxplot",
groupingFactors=list("Condition"),
layoutTopology="1X2",
segregateSamplesBy=list("Cohort"),
showBoxplotOriginalData=TRUE,
showLegend=TRUE,
smpTitle="Biomarker",
theme="GGPlot",
title="Paired boxplots with per-patient connections",
xAxis=list("Biomarker"),
xAxisTitle="Biomarker level"
)
from canvasxpress.canvas import CanvasXpress
from canvasxpress.plot import show_in_browser

if __name__ == "__main__":
  # Define the chart with its data and configuration
  chart: CanvasXpress = CanvasXpress(
    render_to = "boxplot24",
    data = {
      "y": {
        "vars": ["Biomarker"],
        "smps": ["Var1", "Var2", "Var3", "Var4", "Var5", "Var6", "Var7", "Var8", "Var9", "Var10", "Var11", "Var12", "Var13", "Var14", "Var15", "Var16", "Var17", "Var18", "Var19", "Var20", "Var21", "Var22", "Var23", "Var24", "Var25", "Var26", "Var27", "Var28", "Var29", "Var30", "Var31", "Var32", "Var33", "Var34", "Var35", "Var36", "Var37", "Var38", "Var39", "Var40", "Var41", "Var42", "Var43", "Var44", "Var45", "Var46", "Var47", "Var48", "Var49", "Var50", "Var51", "Var52", "Var53", "Var54", "Var55", "Var56", "Var57", "Var58", "Var59", "Var60", "Var61", "Var62", "Var63", "Var64", "Var65", "Var66", "Var67", "Var68", "Var69", "Var70", "Var71", "Var72", "Var73", "Var74", "Var75", "Var76", "Var77", "Var78", "Var79", "Var80", "Var81", "Var82", "Var83", "Var84", "Var85", "Var86", "Var87", "Var88", "Var89", "Var90", "Var91", "Var92", "Var93", "Var94", "Var95", "Var96", "Var97", "Var98", "Var99", "Var100"],
        "data": [
          [10.74, 9.49, 6.56, 5.77, 7.17, 6.24, 7.51, 5.32, 6.84, 5.21, 6.86, 4.77, 8.9, 8.07, 7.86, 6.55, 8.18, 6.72, 10.63, 8.89, 8.43, 6.58, 11.26, 10.66, 10.74, 8.45, 8.39, 6.87, 10.28, 9.13, 8.56, 8.14, 6.93, 4.97, 7.63, 6, 7.99, 5.54, 9.19, 7.47, 9.01, 7.29, 8.85, 8.53, 9.57, 8.64, 6.33, 5.01, 9.53, 8.87, 7.68, 6.32, 7.99, 6.98, 8.44, 7.69, 10.05, 9.7, 8.87, 10.51, 8.58, 8.55, 6.12, 5.82, 8.38, 8.11, 8.2, 7.58, 6.92, 5.99, 8.09, 7.54, 8.19, 7.61, 8.65, 8.11, 8.85, 7.12, 8.38, 8.55, 9.33, 10.34, 8.92, 8.11, 9.38, 9.58, 9.51, 9.4, 8.84, 9.22, 8.52, 7.76, 6.89, 7.49, 7.26, 5.73, 6.96, 6.31, 6.03, 5.61]
        ]
      },
      "x": {
        "Patient": ["P1_1", "P1_1", "P1_2", "P1_2", "P1_3", "P1_3", "P1_4", "P1_4", "P1_5", "P1_5", "P1_6", "P1_6", "P1_7", "P1_7", "P1_8", "P1_8", "P1_9", "P1_9", "P1_10", "P1_10", "P1_11", "P1_11", "P1_12", "P1_12", "P1_13", "P1_13", "P1_14", "P1_14", "P1_15", "P1_15", "P1_16", "P1_16", "P1_17", "P1_17", "P1_18", "P1_18", "P1_19", "P1_19", "P1_20", "P1_20", "P1_21", "P1_21", "P1_22", "P1_22", "P1_23", "P1_23", "P1_24", "P1_24", "P1_25", "P1_25", "P2_1", "P2_1", "P2_2", "P2_2", "P2_3", "P2_3", "P2_4", "P2_4", "P2_5", "P2_5", "P2_6", "P2_6", "P2_7", "P2_7", "P2_8", "P2_8", "P2_9", "P2_9", "P2_10", "P2_10", "P2_11", "P2_11", "P2_12", "P2_12", "P2_13", "P2_13", "P2_14", "P2_14", "P2_15", "P2_15", "P2_16", "P2_16", "P2_17", "P2_17", "P2_18", "P2_18", "P2_19", "P2_19", "P2_20", "P2_20", "P2_21", "P2_21", "P2_22", "P2_22", "P2_23", "P2_23", "P2_24", "P2_24", "P2_25", "P2_25"],
        "Condition": ["Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12"],
        "Cohort": ["Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B"],
        "updown": ["down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "up", "up", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "up", "up", "up", "up", "down", "down", "up", "up", "down", "down", "up", "up", "down", "down", "up", "up", "down", "down", "down", "down", "down", "down"],
        "xpos": [1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2]
      }
    },
    config = {
      "graphType": "Boxplot",
      "graphOrientation": "vertical",
      "theme": "GGPlot",
      "groupingFactors": ["Condition"],
      "segregateSamplesBy": ["Cohort"],
      "xAxis": ["Biomarker"],
      "smpTitle": "Biomarker",
      "xAxisTitle": "Biomarker level",
      "connectBy": "Patient",
      "connectByPointColor": True,
      "connectByWidth": 1,
      "colorBy": "updown",
      "colorKey": {
        "updown": {
          "up": "rgb(224,130,20)",
          "down": "rgb(58,102,160)"
        }
      },
      "showBoxplotOriginalData": True,
      "showLegend": True,
      "layoutTopology": "1X2",
      "title": "Paired boxplots with per-patient connections",
      "decorations": {
        "text": [
          {
            "value": 11.5,
            "label": "p<0.0001",
            "color": "rgb(0,0,0)",
            "panel": 1,
            "smpCenter": True,
            "labelScaleFontFactor": 0.9,
            "preTransformed": True
          },
          {
            "value": 11.5,
            "label": "p=0.022",
            "color": "rgb(0,0,0)",
            "panel": 2,
            "smpCenter": True,
            "labelScaleFontFactor": 0.9,
            "preTransformed": True
          }
        ]
      }
    },
    width = 600,
    height = 600
  )

  # Display the chart in its own Web page
  show_in_browser(chart)
Run this notebook: Open in Binder
from canvasxpress.canvas import CanvasXpress
from canvasxpress.plot import graph

graph(
  CanvasXpress(
    render_to = "boxplot24",
    data = {
      "y": {
        "vars": ["Biomarker"],
        "smps": ["Var1", "Var2", "Var3", "Var4", "Var5", "Var6", "Var7", "Var8", "Var9", "Var10", "Var11", "Var12", "Var13", "Var14", "Var15", "Var16", "Var17", "Var18", "Var19", "Var20", "Var21", "Var22", "Var23", "Var24", "Var25", "Var26", "Var27", "Var28", "Var29", "Var30", "Var31", "Var32", "Var33", "Var34", "Var35", "Var36", "Var37", "Var38", "Var39", "Var40", "Var41", "Var42", "Var43", "Var44", "Var45", "Var46", "Var47", "Var48", "Var49", "Var50", "Var51", "Var52", "Var53", "Var54", "Var55", "Var56", "Var57", "Var58", "Var59", "Var60", "Var61", "Var62", "Var63", "Var64", "Var65", "Var66", "Var67", "Var68", "Var69", "Var70", "Var71", "Var72", "Var73", "Var74", "Var75", "Var76", "Var77", "Var78", "Var79", "Var80", "Var81", "Var82", "Var83", "Var84", "Var85", "Var86", "Var87", "Var88", "Var89", "Var90", "Var91", "Var92", "Var93", "Var94", "Var95", "Var96", "Var97", "Var98", "Var99", "Var100"],
        "data": [
          [10.74, 9.49, 6.56, 5.77, 7.17, 6.24, 7.51, 5.32, 6.84, 5.21, 6.86, 4.77, 8.9, 8.07, 7.86, 6.55, 8.18, 6.72, 10.63, 8.89, 8.43, 6.58, 11.26, 10.66, 10.74, 8.45, 8.39, 6.87, 10.28, 9.13, 8.56, 8.14, 6.93, 4.97, 7.63, 6, 7.99, 5.54, 9.19, 7.47, 9.01, 7.29, 8.85, 8.53, 9.57, 8.64, 6.33, 5.01, 9.53, 8.87, 7.68, 6.32, 7.99, 6.98, 8.44, 7.69, 10.05, 9.7, 8.87, 10.51, 8.58, 8.55, 6.12, 5.82, 8.38, 8.11, 8.2, 7.58, 6.92, 5.99, 8.09, 7.54, 8.19, 7.61, 8.65, 8.11, 8.85, 7.12, 8.38, 8.55, 9.33, 10.34, 8.92, 8.11, 9.38, 9.58, 9.51, 9.4, 8.84, 9.22, 8.52, 7.76, 6.89, 7.49, 7.26, 5.73, 6.96, 6.31, 6.03, 5.61]
        ]
      },
      "x": {
        "Patient": ["P1_1", "P1_1", "P1_2", "P1_2", "P1_3", "P1_3", "P1_4", "P1_4", "P1_5", "P1_5", "P1_6", "P1_6", "P1_7", "P1_7", "P1_8", "P1_8", "P1_9", "P1_9", "P1_10", "P1_10", "P1_11", "P1_11", "P1_12", "P1_12", "P1_13", "P1_13", "P1_14", "P1_14", "P1_15", "P1_15", "P1_16", "P1_16", "P1_17", "P1_17", "P1_18", "P1_18", "P1_19", "P1_19", "P1_20", "P1_20", "P1_21", "P1_21", "P1_22", "P1_22", "P1_23", "P1_23", "P1_24", "P1_24", "P1_25", "P1_25", "P2_1", "P2_1", "P2_2", "P2_2", "P2_3", "P2_3", "P2_4", "P2_4", "P2_5", "P2_5", "P2_6", "P2_6", "P2_7", "P2_7", "P2_8", "P2_8", "P2_9", "P2_9", "P2_10", "P2_10", "P2_11", "P2_11", "P2_12", "P2_12", "P2_13", "P2_13", "P2_14", "P2_14", "P2_15", "P2_15", "P2_16", "P2_16", "P2_17", "P2_17", "P2_18", "P2_18", "P2_19", "P2_19", "P2_20", "P2_20", "P2_21", "P2_21", "P2_22", "P2_22", "P2_23", "P2_23", "P2_24", "P2_24", "P2_25", "P2_25"],
        "Condition": ["Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12"],
        "Cohort": ["Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B"],
        "updown": ["down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "up", "up", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "up", "up", "up", "up", "down", "down", "up", "up", "down", "down", "up", "up", "down", "down", "up", "up", "down", "down", "down", "down", "down", "down"],
        "xpos": [1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2]
      }
    },
    config = {
      "graphType": "Boxplot",
      "graphOrientation": "vertical",
      "theme": "GGPlot",
      "groupingFactors": ["Condition"],
      "segregateSamplesBy": ["Cohort"],
      "xAxis": ["Biomarker"],
      "smpTitle": "Biomarker",
      "xAxisTitle": "Biomarker level",
      "connectBy": "Patient",
      "connectByPointColor": True,
      "connectByWidth": 1,
      "colorBy": "updown",
      "colorKey": {
        "updown": {
          "up": "rgb(224,130,20)",
          "down": "rgb(58,102,160)"
        }
      },
      "showBoxplotOriginalData": True,
      "showLegend": True,
      "layoutTopology": "1X2",
      "title": "Paired boxplots with per-patient connections",
      "decorations": {
        "text": [
          {
            "value": 11.5,
            "label": "p<0.0001",
            "color": "rgb(0,0,0)",
            "panel": 1,
            "smpCenter": True,
            "labelScaleFontFactor": 0.9,
            "preTransformed": True
          },
          {
            "value": 11.5,
            "label": "p=0.022",
            "color": "rgb(0,0,0)",
            "panel": 2,
            "smpCenter": True,
            "labelScaleFontFactor": 0.9,
            "preTransformed": True
          }
        ]
      }
    },
    width = 600,
    height = 600
  )
)
using CanvasXpress

canvasxpress(Dict(
  "y" => Dict(
    "vars" => ["Biomarker"],
    "smps" => ["Var1", "Var2", "Var3", "Var4", "Var5", "Var6", "Var7", "Var8", "Var9", "Var10", "Var11", "Var12", "Var13", "Var14", "Var15", "Var16", "Var17", "Var18", "Var19", "Var20", "Var21", "Var22", "Var23", "Var24", "Var25", "Var26", "Var27", "Var28", "Var29", "Var30", "Var31", "Var32", "Var33", "Var34", "Var35", "Var36", "Var37", "Var38", "Var39", "Var40", "Var41", "Var42", "Var43", "Var44", "Var45", "Var46", "Var47", "Var48", "Var49", "Var50", "Var51", "Var52", "Var53", "Var54", "Var55", "Var56", "Var57", "Var58", "Var59", "Var60", "Var61", "Var62", "Var63", "Var64", "Var65", "Var66", "Var67", "Var68", "Var69", "Var70", "Var71", "Var72", "Var73", "Var74", "Var75", "Var76", "Var77", "Var78", "Var79", "Var80", "Var81", "Var82", "Var83", "Var84", "Var85", "Var86", "Var87", "Var88", "Var89", "Var90", "Var91", "Var92", "Var93", "Var94", "Var95", "Var96", "Var97", "Var98", "Var99", "Var100"],
    "data" => [
      [10.74, 9.49, 6.56, 5.77, 7.17, 6.24, 7.51, 5.32, 6.84, 5.21, 6.86, 4.77, 8.9, 8.07, 7.86, 6.55, 8.18, 6.72, 10.63, 8.89, 8.43, 6.58, 11.26, 10.66, 10.74, 8.45, 8.39, 6.87, 10.28, 9.13, 8.56, 8.14, 6.93, 4.97, 7.63, 6, 7.99, 5.54, 9.19, 7.47, 9.01, 7.29, 8.85, 8.53, 9.57, 8.64, 6.33, 5.01, 9.53, 8.87, 7.68, 6.32, 7.99, 6.98, 8.44, 7.69, 10.05, 9.7, 8.87, 10.51, 8.58, 8.55, 6.12, 5.82, 8.38, 8.11, 8.2, 7.58, 6.92, 5.99, 8.09, 7.54, 8.19, 7.61, 8.65, 8.11, 8.85, 7.12, 8.38, 8.55, 9.33, 10.34, 8.92, 8.11, 9.38, 9.58, 9.51, 9.4, 8.84, 9.22, 8.52, 7.76, 6.89, 7.49, 7.26, 5.73, 6.96, 6.31, 6.03, 5.61]
    ]
  ),
  "x" => Dict(
    "Patient" => ["P1_1", "P1_1", "P1_2", "P1_2", "P1_3", "P1_3", "P1_4", "P1_4", "P1_5", "P1_5", "P1_6", "P1_6", "P1_7", "P1_7", "P1_8", "P1_8", "P1_9", "P1_9", "P1_10", "P1_10", "P1_11", "P1_11", "P1_12", "P1_12", "P1_13", "P1_13", "P1_14", "P1_14", "P1_15", "P1_15", "P1_16", "P1_16", "P1_17", "P1_17", "P1_18", "P1_18", "P1_19", "P1_19", "P1_20", "P1_20", "P1_21", "P1_21", "P1_22", "P1_22", "P1_23", "P1_23", "P1_24", "P1_24", "P1_25", "P1_25", "P2_1", "P2_1", "P2_2", "P2_2", "P2_3", "P2_3", "P2_4", "P2_4", "P2_5", "P2_5", "P2_6", "P2_6", "P2_7", "P2_7", "P2_8", "P2_8", "P2_9", "P2_9", "P2_10", "P2_10", "P2_11", "P2_11", "P2_12", "P2_12", "P2_13", "P2_13", "P2_14", "P2_14", "P2_15", "P2_15", "P2_16", "P2_16", "P2_17", "P2_17", "P2_18", "P2_18", "P2_19", "P2_19", "P2_20", "P2_20", "P2_21", "P2_21", "P2_22", "P2_22", "P2_23", "P2_23", "P2_24", "P2_24", "P2_25", "P2_25"],
    "Condition" => ["Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12", "Baseline", "Week 12"],
    "Cohort" => ["Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort A", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B", "Cohort B"],
    "updown" => ["down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "up", "up", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "down", "up", "up", "up", "up", "down", "down", "up", "up", "down", "down", "up", "up", "down", "down", "up", "up", "down", "down", "down", "down", "down", "down"],
    "xpos" => [1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2]
  )
);
  graphType = "Boxplot",
  graphOrientation = "vertical",
  theme = "GGPlot",
  groupingFactors = ["Condition"],
  segregateSamplesBy = ["Cohort"],
  xAxis = ["Biomarker"],
  smpTitle = "Biomarker",
  xAxisTitle = "Biomarker level",
  connectBy = "Patient",
  connectByPointColor = true,
  connectByWidth = 1,
  colorBy = "updown",
  colorKey = Dict(
    "updown" => Dict(
      "up" => "rgb(224,130,20)",
      "down" => "rgb(58,102,160)"
    )
  ),
  showBoxplotOriginalData = true,
  showLegend = true,
  layoutTopology = "1X2",
  title = "Paired boxplots with per-patient connections",
  decorations = Dict(
    "text" => [
      Dict(
        "value" => 11.5,
        "label" => "p<0.0001",
        "color" => "rgb(0,0,0)",
        "panel" => 1,
        "smpCenter" => true,
        "labelScaleFontFactor" => 0.9,
        "preTransformed" => true
      ),
      Dict(
        "value" => 11.5,
        "label" => "p=0.022",
        "color" => "rgb(0,0,0)",
        "panel" => 2,
        "smpCenter" => true,
        "labelScaleFontFactor" => 0.9,
        "preTransformed" => true
      )
    ]
  )
)
⇧