Integrated Cancer Genomic Analysis

Oncoprint graphs offer a visually appealing and informative way to explore genomic alterations across multiple samples in cancer research. They condense complex data into an easily digestible format, highlighting the frequency and type of mutations, copy number variations, and other genomic events within a tumor cohort. This allows researchers to quickly identify patterns and potential therapeutic targets. These graphs typically display samples as rows and genomic alterations as columns, using color-coding to represent different mutation types or copy number changes. Oncoprints are invaluable for identifying frequently mutated genes, characterizing tumor heterogeneity, and guiding personalized cancer medicine strategies. The visualization helps researchers to understand cancer evolution and develop effective treatment plans.

Aa Aa Aa Aa Aa Aa Aa Aa Aa Aa

HTML / JS
R Code

<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 = {
         "x" : {
            "Annt1" : ["Desc : 1","Desc : 2","Desc : 1"],
            "Annt2" : [23,34,52],
            "Annt3" : [12,14,34],
            "Annt4" : [8,14,14],
            "Annt5" : [17,9,18]
         },
         "y" : {
            "data" : [
              [3.1,3.5,4],
              [3,7.4,4.1],
              [2.8,3.1,3.3],
              [2.3,2.4,2.1],
              [4.9,6.1,6.1],
              [1.9,2.1,0.1],
              [2.2,1.9,2.1],
              [1.7,2.1,0.2],
              [0.2,4.9,3.9]
            ],
            "data2" : [["","","Amplification"],
              ["","Amplification",""],
              ["","",""],
              ["","",""],
              ["","Amplification","Amplification"],
              ["","",""],
              ["","",""],
              ["","","Deletion"],
              ["Deletion","Amplification",""]
            ],
            "data3" : [["","","Missence"],
              ["","","Truncating"],
              ["Nonsense","",""],
              ["","Missence",""],
              ["","Truncating",""],
              ["","Nonsense",""],
              ["","",""],
              ["Missence","",""],
              ["","",""]
            ],
            "data4" : [["","A",""],
              ["","A",""],
              ["","A",""],
              ["","A",""],
              ["","B",""],
              ["","B",""],
              ["","","B"],
              ["","","B"],
              ["B","",""]
            ],
            "smps" : ["V1","V2","V3"],
            "vars" : ["S1","S2","S3","S4","S5","S6","S7","S8","S9"]
         },
         "z" : {
            "Factor" : ["Lev : 1","Lev : 2","Lev : 1","Lev : 2","Lev : 1","Lev : 2","Lev : 1","Lev : 2","Lev : 1"]
         }
      }

      // Create the configuration for the graph
      var config = {
         "graphType" : "Heatmap",
         "oncoprintCNA" : "data2",
         "oncoprintMUT" : "data3",
         "overlaysThickness" : 100,
         "smpOverlayProperties" : {
            "Annt2" : {
               "position" : "right",
               "type" : "Bar"
            },
            "Annt3" : {
               "type" : "Stacked"
            },
            "Annt4" : {
               "type" : "Stacked"
            },
            "Annt5" : {
               "type" : "Stacked"
            }
         },
         "smpOverlays" : ["Annt1","-","Annt2","Annt3","Annt4","Annt5"],
         "xAxis" : ["S1","S2","S3","S4","S5","S6","S7","S8","S9"]
      }

      // 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-oncoprint-dat.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
y2=read.table("https://www.canvasxpress.org/data/r/cX-oncoprint-dat2.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
y3=read.table("https://www.canvasxpress.org/data/r/cX-oncoprint-dat3.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
y4=read.table("https://www.canvasxpress.org/data/r/cX-oncoprint-dat4.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-oncoprint-smp.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
z=read.table("https://www.canvasxpress.org/data/r/cX-oncoprint-var.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE)
canvasXpress(
  data=list(y=y, data2=y2, data3=y3, data4=y4),
  smpAnnot=x,
  varAnnot=z,
  graphType="Heatmap",
  oncoprintCNA="data2",
  oncoprintMUT="data3",
  overlaysThickness=100,
  smpOverlayProperties=list(Annt2=list(position="right", type="Bar"), Annt3=list(type="Stacked"), Annt4=list(type="Stacked"), Annt5=list(type="Stacked")),
  smpOverlays=list("Annt1", "-", "Annt2", "Annt3", "Annt4", "Annt5"),
  xAxis=list("S1", "S2", "S3", "S4", "S5", "S6", "S7", "S8", "S9")
)