comparison js/scatter3D.js @ 1:b5453d07f740 draft default tip

"planemo upload for repository https://github.com/ImmPortDB/immport-galaxy-tools/tree/master/flowtools/flow_overview commit 65373effef15809f3db0e5f9603ef808f4110aa3"
author azomics
date Wed, 29 Jul 2020 17:03:53 -0400
parents
children
comparison
equal deleted inserted replaced
0:8283ff163ba6 1:b5453d07f740
1 // Copyright (c) 2016 Northrop Grumman.
2 // All rights reserved.
3
4 var updateScatter3D = function(){
5 scatterData3D['selectedPopulations'] = [];
6 scatterData3DMFI['selectedPopulations'] = [];
7 $('.pop3D').each(function() {
8 if (this.checked) {
9 scatterData3D['selectedPopulations'].push(parseInt(this.value));
10 scatterData3DMFI['selectedPopulations'].push(parseInt(this.value));
11 }
12 });
13 processScatterData3D();
14 processScatterData3DMFI();
15 displayScatterPlot3D();
16 };
17
18 var processScatterData3D = function() {
19 var xData = [],
20 yData = [],
21 zData = [],
22 popData = [],
23 pop = [],
24 col1 = [],
25 col2 = [],
26 col3 = [],
27 min = Number.MAX_VALUE,
28 max = Number.MIN_VALUE;
29
30 min = d3.min(scatterData3D['data'], function(array) {
31 return d3.min(array);
32 });
33 max = d3.max(scatterData3D['data'], function(array) {
34 return d3.max(array);
35 });
36 scatterData3D['min'] = 0;
37 scatterData3D['max'] = max;
38
39 col1 = scatterData3D['data'].map(function(value,index) {
40 return value[scatterData3D['m1']];
41 });
42 col2 = scatterData3D['data'].map(function(value,index) {
43 return value[scatterData3D['m2']];
44 });
45 col3 = scatterData3D['data'].map(function(value,index) {
46 return value[scatterData3D['m3']];
47 });
48 pop = scatterData3D['data'].map(function(value,index) {
49 return value[scatterData3D['popCol']];
50 });
51
52 for (var i = 0, j = col1.length; i < j; i++) {
53 if (scatterData3D['selectedPopulations'].indexOf(pop[i]) >= 0) {
54 xData.push(col1[i]);
55 yData.push(col2[i]);
56 zData.push(col3[i]);
57 popData.push(pop[i]);
58 }
59 }
60
61 scatterData3D['popColors'] = popData.map(function(value,index) {
62 return color_palette[0][value][0];
63 });
64 scatterData3D['xData'] = xData;
65 scatterData3D['yData'] = yData;
66 scatterData3D['zData'] = zData;
67 scatterData3D['popData'] = popData;
68 return scatterData3D;
69 };
70
71 var displayScatterToolbar3D = function() {
72 $("#xAxisMarker3D").select2();
73 $("#yAxisMarker3D").select2();
74 $("#zAxisMarker3D").select2();
75 $("#view3D").select2();
76
77 scatterData3D['columnHeadings'].map(function(value,index) {
78 $('#xAxisMarker3D')
79 .append($("<option></option>")
80 .attr("value",index)
81 .text(value));
82
83 $('#yAxisMarker3D')
84 .append($("<option></option>")
85 .attr("value",index)
86 .text(value));
87
88 $('#zAxisMarker3D')
89 .append($("<option></option>")
90 .attr("value",index)
91 .text(value));
92 });
93
94 $('#xAxisMarker3D').select2("val",0);
95 $('#yAxisMarker3D').select2("val",1);
96 $('#zAxisMarker3D').select2("val",2);
97
98 $("#xAxisMarker3D").on("change",function(e) {
99 var m1 = $("#xAxisMarker3D").select2("val");
100 scatterData3D['m1'] = m1;
101 scatterData3DMFI['m1'] = m1;
102 updateScatter3D();
103 });
104 $("#yAxisMarker3D").on("change",function(e) {
105 var m2 = $("#yAxisMarker3D").select2("val");
106 scatterData3D['m2'] = m2;
107 scatterData3DMFI['m2'] = m2;
108 updateScatter3D();
109 });
110 $("#zAxisMarker3D").on("change",function(e) {
111 var m3 = $("#zAxisMarker3D").select2("val");
112 scatterData3D['m3'] = m3;
113 scatterData3DMFI['m3'] = m3;
114 updateScatter3D();
115 });
116
117 $("#view3D").on("change",function(e) {
118 var view = $("#view3D").select2("val");
119 scatterData3D['view'] = view;
120 updateScatter3D();
121 });
122
123 $("#updateDisplay3D").on("click",function() {
124 $(".pop3D").prop("checked", true);
125 $("#selectall3D").prop('checked', true);
126 updateScatter3D();
127 });
128 };
129
130 var displayScatterPopulation3D = function() {
131 $("#populationTable3D tbody").empty();
132 scatterData3D['populations'].map(function(value) {
133 $('#populationTable3D tbody')
134 .append('<tr><td align="center">'
135 + '<input type="checkbox" checked class="pop3D" value='
136 + value + '/></td><td title="'+ newNames[value]
137 + '">'+ newNames[value] + '</td>'
138 + '<td><span style="background-color:'
139 + color_palette[0][value][0] + '">&nbsp;&nbsp;&nbsp</span></td>'
140 + '<td>' + scatterData3D['percent'][value - 1] + '</td></tr>');
141 });
142
143 $('#selectall3D').click(function() {
144 var checkAll = $("#selectall3D").prop('checked');
145 if (checkAll) {
146 $(".pop3D").prop("checked", true);
147 } else {
148 $(".pop3D").prop("checked", false);
149 }
150 updateScatter3D();
151 });
152 $('.pop3D').click(function() {
153 if ($('.pop3D').length == $(".pop3D:checked").length) {
154 $('#selectall3D').prop("checked",true);
155 } else {
156 $('#selectall3D').prop("checked",false);
157 }
158 updateScatter3D();
159 });
160
161 $('.pop3D').each(function() {
162 var selectedpop3D = parseInt(this.value);
163 if ($.inArray(selectedpop3D,scatterData3D['selectedPopulations']) > -1) {
164 this.checked = true;
165 } else {
166 this.checked = false;
167 }
168 });
169 };
170
171 var displayScatterPlot3D = function() {
172 var h = $(window).height() - 200,
173 w = $("#scatterPlotDiv3D").width(),
174 xtitle = scatterData3D['columnHeadings'][scatterData3D['m1']],
175 ytitle = scatterData3D['columnHeadings'][scatterData3D['m2']],
176 ztitle = scatterData3D['columnHeadings'][scatterData3D['m3']],
177 view = scatterData3D['view'],
178 traces = [],
179 layout = {};
180
181 $("#scatterPlotDiv3D").empty();
182 $("#scatterPlotDiv3D").height(h);
183
184 if ( view == 1 || view == 2 ) {
185 var trace1 = {
186 x: scatterData3D['xData'],
187 y: scatterData3D['yData'],
188 z: scatterData3D['zData'],
189 mode: 'markers',
190 opacity: .75,
191 hoverinfo: "none",
192 marker: {
193 size: 2,
194 color: scatterData3D['popColors']
195 },
196 type: 'scatter3d'
197 };
198 traces.push(trace1);
199 };
200
201 if ( view == 1 || view == 3) {
202 var trace2 = {
203 x: scatterData3DMFI['xData'],
204 y: scatterData3DMFI['yData'],
205 z: scatterData3DMFI['zData'],
206 mode: 'markers',
207 opacity: 1.0,
208 hoverinfo: "x+y+z",
209 marker: {
210 symbol: "circle-open",
211 size: 8,
212 color: scatterData3DMFI['popColors']
213 },
214 type: 'scatter3d'
215 };
216 traces.push(trace2);
217 }
218
219 layout = {
220 title: '',
221 showlegend: false,
222 scene: {
223 aspectratio: {
224 x: 1,
225 y: 1,
226 z: 1
227 },
228 camera: {
229 center: {
230 x: 0,
231 y: 0,
232 z: 0
233 },
234 eye: {
235 x: 1.25,
236 y: 1.25,
237 z: 1.25
238 },
239 up: {
240 x: 0,
241 y: 0,
242 z: 1
243 }
244 },
245 xaxis: {
246 type: 'linear',
247 title: xtitle,
248 range: [0, scatterData3D['max']],
249 zeroline: false
250 },
251 yaxis: {
252 type: 'linear',
253 title: ytitle,
254 range: [0, scatterData3D['max']],
255 zeroline: false
256 },
257 zaxis: {
258 type: 'linear',
259 title: ztitle,
260 range: [0, scatterData3D['max']],
261 zeroline: false
262 }
263 }
264 };
265
266 Plotly.newPlot('scatterPlotDiv3D', traces, layout);
267 };