diff options
| author | Arun Isaac | 2023-12-29 18:55:37 +0000 |
|---|---|---|
| committer | Arun Isaac | 2023-12-29 19:01:46 +0000 |
| commit | 204a308be0f741726b9a620d88fbc22b22124c81 (patch) | |
| tree | b3cf66906674020b530c844c2bb4982c8a0e2d39 /gn2/wqflask/templates/pca_scree_plot.html | |
| parent | 83062c75442160427b50420161bfcae2c5c34c84 (diff) | |
| download | genenetwork2-204a308be0f741726b9a620d88fbc22b22124c81.tar.gz | |
Namespace all modules under gn2.
We move all modules under a gn2 directory. This is important for
"correct" packaging and deployment as a Guix service.
Diffstat (limited to 'gn2/wqflask/templates/pca_scree_plot.html')
| -rw-r--r-- | gn2/wqflask/templates/pca_scree_plot.html | 85 |
1 files changed, 85 insertions, 0 deletions
diff --git a/gn2/wqflask/templates/pca_scree_plot.html b/gn2/wqflask/templates/pca_scree_plot.html new file mode 100644 index 00000000..74eb2c15 --- /dev/null +++ b/gn2/wqflask/templates/pca_scree_plot.html @@ -0,0 +1,85 @@ +<!DOCTYPE html> +<html> + +<head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title></title> +</head> + +<body> + <div> + <h2>Scree Plot</h2> + <div style="padding-bottom: 10px;">Review more on <a href="https://en.wikipedia.org/wiki/Scree_plot">scree plots</a>.</div> + <div id="scree_plot" style="width:700px;height:600px;"></div> + </div> +</body> +<script type="text/javascript" src="{{ url_for('js', filename='plotly/plotly.min.js') }}"></script> +<script type="text/javascript"> +js_data = {{ js_data | safe }} + +let { x_coord, y_coord } = js_data["scree_data"] + + +const layout = { + yaxis: { + title: { + text: "% of Variance", + font: { + "size": 18, + "color": "" + + } + } + }, + + xaxis: { + title: { + text: "Principal Components", + font: { + "size": 18, + "color": "" + + } + } + }, + +} + +const data = [{ + x: x_coord, + y: y_coord, + marker: { + + color: 'rgb(17, 157, 255)', + size: 5, + line: { + color: 'rgb(255, 0, 0)', + width: 3 + } + + } +}] + + +let custom_configs = (filename, download_format, modebar = true) => { + + return { + displayModeBar: modebar, + scrollZoom: false, + toImageButtonOptions: { + filename, + format:download_format, + height: 600, + width: 700, + scale: 1 + } + } + +} + +Plotly.newPlot(document.getElementById("scree_plot"), data, layout, + custom_configs(file_name = "scree_plot", download_format = "svg")); +</script> + +</html> |