fixed correlation issue

master
parent 1a6b41cc7e
commit 63d46f9520
  1. 9
      css/style.css
  2. 2
      data/dataR2.csv
  3. 95
      index.html
  4. 113
      js/checkbox.js
  5. 26
      js/data_form_handler.js
  6. 3
      js/tsne.js
  7. 1491
      js/tsne_vis.js

@ -220,7 +220,6 @@ rect {
box-sizing: border-box;
display: inline;
font-size: 10px;
width: 100%;
line-height: 1;
color: rgba(0, 0, 0, 0.8);
content: "\25BC";
@ -310,7 +309,7 @@ rect {
}
.bar {
/*shape-rendering: crispEdges;*/
shape-rendering: crispEdges;
}
/* Styling for the annotation circle */
@ -351,7 +350,7 @@ rect {
.children-columns{
display: flex;
}
/* Margins for the extra-information panel and the kNNInfo */
#extra-information {
margin-top: 40px;
margin-left: 10px;
@ -370,6 +369,8 @@ rect {
margin-left:10px;
}
/* Draw a red colored button for reset */
#FactRes{
color: red;
}
}

@ -1,4 +1,4 @@
Age,BMI,Glucose,Insulin,HOMA,Leptin,Adiponectin,Resistin,MCP.1,name
Age,BMI,Glucose,Insulin,HOMA,Leptin,Adiponectin,Resistin,MCP.1,Category*
48,23.5,70,2.707,0.467408667,8.8071,9.7024,7.99585,417.114,1
83,20.69049454,92,3.115,0.706897333,8.8438,5.429285,4.06405,468.786,1
82,23.12467037,91,4.498,1.009651067,17.9393,22.43204,9.27715,554.697,1

1 Age BMI Glucose Insulin HOMA Leptin Adiponectin Resistin MCP.1 name Category*
2 48 23.5 70 2.707 0.467408667 8.8071 9.7024 7.99585 417.114 1
3 83 20.69049454 92 3.115 0.706897333 8.8438 5.429285 4.06405 468.786 1
4 82 23.12467037 91 4.498 1.009651067 17.9393 22.43204 9.27715 554.697 1

@ -12,7 +12,7 @@
<script src='./modules/d3v3/d3.min.js'></script>
<script src='./modules/d3/d3.min.js'></script>
<!-- Importing additional modules such as starPlot, annotator, tip, legend, switch, papaParse, and Jquery. -->
<!-- Importing additional modules such as starPlot, annotator, tip, legend, lasso, papaParse, and Jquery. -->
<script src='./modules/d3-star/d3-starPlot.js'></script>
<script src='./modules/d3-annotations/d3-annotator.js'></script>
<script src="./modules/d3-tip/tip.js"></script>
@ -24,7 +24,6 @@
<!-- Basic scripts that we execute. -->
<script src="./js/tsne.js"></script>
<script src="./js/checkbox.js"></script>
<script src="./js/data_form_handler.js"></script>
<script src="./modules/pca/pca.js"></script>
@ -128,52 +127,52 @@
</div>
<div class="panel-body">
<div id="control-panel" data-sr="enter left over 8s">
<div class="param">
<label id="data" for="param-dataset">Data sets</label>
<select id="param-dataset" name="param-dataset" onChange="changeDataset(this.value);">
<option value="winequality-red.csv">Red Wine - Quality</option>
<option value="iris.csv" selected>Iris</option>
<option value="mnist.csv" >Mnist</option>
<option value="Frogs_MFCCs_s.csv" >Frogs</option>
<option value="empty">Add New File</option>
</select>
<button type="button" class="button" id="FactRes" onclick="FactoryReset()">Factory reset</button>
</div>
<div class="param">
<label for="param-perplexity">Perplexity</label>
<input id="param-perplexity" type="range" min="2" max="100" value="30", step="1">
<output for="param-perplexity" id="param-perplexity-value">30</output>
</div>
<div class="param">
<label for="param-learningrate">Learning rate</label>
<input id="param-learningrate" type="range" min="1" max="300" value="10", step="1">
<output for="param-learningrate" id="param-learningrate-value">10</output>
</div>
<div class="param">
<label for="param-maxiter">Max iterations</label>
<input id="param-maxiter" type="range" min="10" max="1000" value="500", step="10">
<output for="param-maxiter" id="param-maxiter-value">500</output>
</div>
<div class="param">
<label for="param-distance">Distance metric</label>
<select id="param-distance" name="param-distance">
<option value="euclideanDist" selected>Euclidean distance</option>
<option value="jaccardDist">Jaccard dissimilarity</option>
</select>
<input id="file-input" type="file" name="name" style="display: none;" />
<button type="button" class="button" onclick='loadAnalysis();'>Load Execut.</button>
</div>
<div class="param">
<label for="param-transform">Data transform</label>
<select id="param-transform" name="param-transform">
<option value="noTrans" selected>No transform</option>
<option value="logTrans">Log10</option>
<option value="asinhTrans">Asinh</option>
<option value="binTrans">Binarize</option>
</select>
<button type="button" class="button" onclick="SaveAnalysis()">Save Execut.</button>
</div>
<p><div id="run-button"><button id="ExecuteBut" class="btn btn-primary btn-block" onclick="getData();" value="Execute new t-SNE analysis">Execute new t-SNE analysis</button></div></p>
<div class="param">
<label id="data" for="param-dataset">Data sets</label>
<select id="param-dataset" name="param-dataset" onChange="changeDataset(this.value);">
<option value="winequality-red.csv">Red Wine - Quality</option>
<option value="iris.csv" selected>Iris</option>
<option value="mnist.csv" >Mnist</option>
<option value="Frogs_MFCCs_s.csv" >Frogs</option>
<option value="empty">Add New File</option>
</select>
<button type="button" class="button" id="FactRes" onclick="FactoryReset()">Factory reset</button>
</div>
<div class="param">
<label for="param-perplexity">Perplexity</label>
<input id="param-perplexity" type="range" min="2" max="100" value="30", step="1">
<output for="param-perplexity" id="param-perplexity-value">30</output>
</div>
<div class="param">
<label for="param-learningrate">Learning rate</label>
<input id="param-learningrate" type="range" min="1" max="300" value="10", step="1">
<output for="param-learningrate" id="param-learningrate-value">10</output>
</div>
<div class="param">
<label for="param-maxiter">Max iterations</label>
<input id="param-maxiter" type="range" min="10" max="1000" value="500", step="10">
<output for="param-maxiter" id="param-maxiter-value">500</output>
</div>
<div class="param">
<label for="param-distance">Distance metric</label>
<select id="param-distance" name="param-distance">
<option value="euclideanDist" selected>Euclidean distance</option>
<option value="jaccardDist">Jaccard dissimilarity</option>
</select>
<input id="file-input" type="file" name="name" style="display: none;" />
<button type="button" class="button" onclick='loadAnalysis();'>Load Execut.</button>
</div>
<div class="param">
<label for="param-transform">Data transform</label>
<select id="param-transform" name="param-transform">
<option value="noTrans" selected>No transform</option>
<option value="logTrans">Log10</option>
<option value="asinhTrans">Asinh</option>
<option value="binTrans">Binarize</option>
</select>
<button type="button" class="button" onclick="SaveAnalysis()">Save Execut.</button>
</div>
<p><div id="run-button"><button id="ExecuteBut" class="btn btn-primary btn-block" onclick="getData();" value="Execute new t-SNE analysis">Execute new t-SNE analysis</button></div></p>
</div>
</div>
</div>

@ -1,113 +0,0 @@
function d3CheckBox () {
var size = 20,
x = 0,
y = 0,
rx = 0,
ry = 0,
markStrokeWidth = 3,
boxStrokeWidth = 3,
checked = false,
clickEvent;
function checkBox (selection) {
var g = selection.append("g"),
box = g.append("rect")
.attr("width", size)
.attr("height", size)
.attr("x", x)
.attr("y", y)
.attr("rx", rx)
.attr("ry", ry)
.style({
"fill-opacity": 0,
"stroke-width": boxStrokeWidth,
"stroke": "black"
});
//Data to represent the check mark
var coordinates = [
{x: x + (size / 8), y: y + (size / 3)},
{x: x + (size / 2.2), y: (y + size) - (size / 4)},
{x: (x + size) - (size / 8), y: (y + (size / 10))}
];
var line = d3.svg.line()
.x(function(d){ return d.x; })
.y(function(d){ return d.y; })
.interpolate("basic");
var mark = g.append("path")
.attr("d", line(coordinates))
.style({
"stroke-width" : markStrokeWidth,
"stroke" : "black",
"fill" : "none",
"opacity": (checked)? 1 : 0
});
g.on("click", function () {
checked = !checked;
mark.style("opacity", (checked)? 1 : 0);
if(clickEvent)
clickEvent();
d3.event.stopPropagation();
});
}
checkBox.size = function (val) {
size = val;
return checkBox;
}
checkBox.x = function (val) {
x = val;
return checkBox;
}
checkBox.y = function (val) {
y = val;
return checkBox;
}
checkBox.rx = function (val) {
rx = val;
return checkBox;
}
checkBox.ry = function (val) {
ry = val;
return checkBox;
}
checkBox.markStrokeWidth = function (val) {
markStrokeWidth = val;
return checkBox;
}
checkBox.boxStrokeWidth = function (val) {
boxStrokeWidth = val;
return checkBox;
}
checkBox.checked = function (val) {
if(val === undefined) {
return checked;
} else {
checked = val;
return checkBox;
}
}
checkBox.clickEvent = function (val) {
clickEvent = val;
return checkBox;
}
return checkBox;
}

@ -1,16 +1,20 @@
function changeDataset(value) {
var format = value.split("."); //get the actual format
if (format[value.split(".").length-1] == "csv") {
}else{
d3.select("#data").select("input").remove();
d3.select("#data")
.append("input")
.attr("type", "file")
.on("change", function() {
var format = value.split("."); // Get the data set's format.
if (format[value.split(".").length-1] != "csv") { // This is for a new file.
d3.select("#data").select("input").remove();
d3.select("#data")
.append("input")
.attr("type", "file")
.style("font-size", "10px")
.on("change", function() {
var file = d3.event.target.files[0];
getfile(file);
})
}
getfile(file);
})
} else {
d3.select("#data").select("input").remove(); // Remove the selection field.
}
}

@ -1,4 +1,5 @@
// create main global object
// t-SNE Algorithm
var tsnejs = tsnejs || { REVISION: 'ALPHA' };
(function(global) {

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save