A scatterplot displays the relationship between 3 numeric variables. For each data point, the value of its first variable is represented on the X axis, the second on the Y axis, and the third on the Z axis.
<!-- 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/canvasXpress.min.js"></script> <!-- 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" : { "data" : [ [-5,5,5], [-5,15,15], [-5,25,25], [-5,35,35], [-5,45,45], [-5,35,55], [-5,25,65], [-5,15,75], [-5,5,85], [-15,15,5], [-15,25,15], [-15,35,25], [-15,45,35], [-15,55,45], [-15,45,55], [-15,35,65], [-15,25,75], [-15,15,85], [-25,25,5], [-25,35,15], [-25,45,25], [-25,55,35], [-25,65,45], [-25,55,55], [-25,45,65], [-25,35,75], [-25,25,85], [-35,35,5], [-35,45,15], [-35,55,25], [-35,65,35], [-35,75,45], [-35,65,55], [-35,55,65], [-35,45,75], [-35,35,85], [-45,45,5], [-45,55,15], [-45,65,25], [-45,75,35], [-45,85,45], [-45,75,55], [-45,65,65], [-45,55,75], [-45,45,85], [-55,35,5], [-55,45,15], [-55,55,25], [-55,65,35], [-55,75,45], [-55,65,55], [-55,55,65], [-55,45,75], [-55,35,85], [-65,25,5], [-65,35,15], [-65,45,25], [-65,55,35], [-65,65,45], [-65,55,55], [-65,45,65], [-65,35,75], [-65,25,85], [-75,15,5], [-75,25,15], [-75,35,25], [-75,45,35], [-75,55,45], [-75,45,55], [-75,35,65], [-75,25,75], [-75,15,85], [-85,5,5], [-85,15,15], [-85,25,25], [-85,35,35], [-85,45,45], [-85,35,55], [-85,25,65], [-85,15,75], [-85,5,85] ], "smps" : ["S1","S2","S3"], "vars" : ["V1","V2","V3","V4","V5","V6","V7","V8","V9","V10","V11","V12","V13","V14","V15","V16","V17","V18","V19","V20","V21","V22","V23","V24","V25","V26","V27","V28","V29","V30","V31","V32","V33","V34","V35","V36","V37","V38","V39","V40","V41","V42","V43","V44","V45","V46","V47","V48","V49","V50","V51","V52","V53","V54","V55","V56","V57","V58","V59","V60","V61","V62","V63","V64","V65","V66","V67","V68","V69","V70","V71","V72","V73","V74","V75","V76","V77","V78","V79","V80","V81"] } } <-- Create the configuration for the graph --> var config = { "graphType":"Scatter3D", "scatterType":"bar", "theme":"CanvasXpress", "xAxis":[ "S1" ], "yAxis":[ "S2" ], "zAxis":[ "S3" ] } <!-- Call the CanvasXpress function to create the graph --> var cX = new CanvasXpress("canvasId", data, config); </script>
library(canvasXpress) y=read.table("https://www.canvasxpress.org/data/cX-scatter3d-dat.txt", header=TRUE, sep="\t", quote="", row.names=1, fill=TRUE, check.names=FALSE, stringsAsFactors=FALSE) canvasXpress( data=y, graphType="Scatter3D", scatterType="bar", theme="CanvasXpress", xAxis=list("S1"), yAxis=list("S2"), zAxis=list("S3") )