Daniel@0
|
1 "use strict";
|
Daniel@0
|
2
|
Daniel@0
|
3 App.module("GraphicsRenderingModule", function(GraphicsRenderingModule, App, Backbone, Marionette, $, _, Logger) {
|
Daniel@0
|
4
|
Daniel@0
|
5 GraphicsRenderingModule.addInitializer(function(options){
|
Daniel@0
|
6
|
Daniel@0
|
7 GraphicsRenderingModule.registerRenderer({
|
Daniel@0
|
8 id: "similarity-matrix",
|
Daniel@0
|
9 inherit: "_",
|
Daniel@0
|
10
|
Daniel@0
|
11 defaultVegaConfig: {
|
Daniel@0
|
12 comparisonMode: null,
|
Daniel@0
|
13
|
Daniel@0
|
14 colorForData: "#3182bd",
|
Daniel@0
|
15
|
Daniel@0
|
16 padding: {"top": 5, "left": 0, "bottom": 0, "right": 0},
|
Daniel@0
|
17 },
|
Daniel@0
|
18
|
Daniel@0
|
19
|
Daniel@0
|
20 _formVC: function(vc, data) {
|
Daniel@0
|
21 vc.enoughSpaceForAxisLabels = vc.totalWidth > 200;
|
Daniel@0
|
22 vc.width = vc.totalWidth - vc.padding.left - vc.padding.right;
|
Daniel@0
|
23 vc.height = vc.totalHeight - vc.padding.top - vc.padding.bottom;
|
Daniel@0
|
24
|
Daniel@0
|
25 var stats = {
|
Daniel@0
|
26 list: [],
|
Daniel@0
|
27 distance: []
|
Daniel@0
|
28 }
|
Daniel@0
|
29 if (data.self.stats) {
|
Daniel@0
|
30 data.self.stats = stats
|
Daniel@0
|
31 }
|
Daniel@0
|
32 var recordingCount = stats.list.length;
|
Daniel@0
|
33
|
Daniel@0
|
34
|
Daniel@0
|
35 // :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
|
Daniel@0
|
36 // Data
|
Daniel@0
|
37 var distance = stats.distance;
|
Daniel@0
|
38 var list = stats.list;
|
Daniel@0
|
39
|
Daniel@0
|
40 // .............................................................
|
Daniel@0
|
41 // Data - cells
|
Daniel@0
|
42 var cellsInVegaData = [];
|
Daniel@0
|
43 var maxDistance = 0;
|
Daniel@0
|
44 for (var column = 0; column < recordingCount; ++column) {
|
Daniel@0
|
45 for (var row = 0; row < recordingCount; ++row) {
|
Daniel@0
|
46 var currentDistance = distance[row][column];
|
Daniel@0
|
47 if (currentDistance < 1E-5) {
|
Daniel@0
|
48 currentDistance = 0;
|
Daniel@0
|
49 }
|
Daniel@0
|
50 var cellInVegaData = {
|
Daniel@0
|
51 column: column,
|
Daniel@0
|
52 row: row,
|
Daniel@0
|
53 nextColumn: column + 1,
|
Daniel@0
|
54 nextRow: row + 1,
|
Daniel@0
|
55 distance: currentDistance
|
Daniel@0
|
56 };
|
Daniel@0
|
57 if (column != row) {
|
Daniel@0
|
58 cellInVegaData.tooltip = "↔ " + list[row].label
|
Daniel@0
|
59 + "<br/>↕ " + list[column].label
|
Daniel@0
|
60 + "<br/>" + GraphicsRenderingModule._formatNumberForTooltip(cellInVegaData.distance);
|
Daniel@0
|
61 } else {
|
Daniel@0
|
62 cellInVegaData.tooltip = list[row].label;
|
Daniel@0
|
63 }
|
Daniel@0
|
64
|
Daniel@0
|
65 cellsInVegaData.push(cellInVegaData);
|
Daniel@0
|
66 if (cellInVegaData.distance > maxDistance) {
|
Daniel@0
|
67 maxDistance = cellInVegaData.distance;
|
Daniel@0
|
68 }
|
Daniel@0
|
69 }
|
Daniel@0
|
70 }
|
Daniel@0
|
71
|
Daniel@0
|
72 vc.data.push({
|
Daniel@0
|
73 "name": "cells",
|
Daniel@0
|
74 "values": cellsInVegaData
|
Daniel@0
|
75 });
|
Daniel@0
|
76
|
Daniel@0
|
77
|
Daniel@0
|
78 // :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
|
Daniel@0
|
79 // Scales
|
Daniel@0
|
80
|
Daniel@0
|
81 // .............................................................
|
Daniel@0
|
82 // Scale - columns
|
Daniel@0
|
83 vc.scales.push({
|
Daniel@0
|
84 //"type": "ordinal",
|
Daniel@0
|
85 "name": "column",
|
Daniel@0
|
86 "domainMin": 0,
|
Daniel@0
|
87 "domainMax": recordingCount,
|
Daniel@0
|
88 "point": true,
|
Daniel@0
|
89 "round": true,
|
Daniel@0
|
90 "range": [0, vc.width]
|
Daniel@0
|
91 });
|
Daniel@0
|
92
|
Daniel@0
|
93 // .............................................................
|
Daniel@0
|
94 // Scale - rows
|
Daniel@0
|
95 vc.scales.push({
|
Daniel@0
|
96 //"type": "ordinal",
|
Daniel@0
|
97 "name": "row",
|
Daniel@0
|
98 "domainMin": 0,
|
Daniel@0
|
99 "domainMax": recordingCount,
|
Daniel@0
|
100 "point": true,
|
Daniel@0
|
101 "round": true,
|
Daniel@0
|
102 "range": [0, vc.height]
|
Daniel@0
|
103 });
|
Daniel@0
|
104
|
Daniel@0
|
105 // .............................................................
|
Daniel@0
|
106 // Scale - fill opacity
|
Daniel@0
|
107 vc.scales.push({
|
Daniel@0
|
108 "name": "fillOpacity",
|
Daniel@0
|
109 "type": "linear",
|
Daniel@0
|
110 "domain": [0, maxDistance],
|
Daniel@0
|
111 "point": true,
|
Daniel@0
|
112 "range": [0, 1]
|
Daniel@0
|
113 });
|
Daniel@0
|
114
|
Daniel@0
|
115
|
Daniel@0
|
116 // :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
|
Daniel@0
|
117 // Marks
|
Daniel@0
|
118
|
Daniel@0
|
119 // .............................................................
|
Daniel@0
|
120 // Mark - background (to catch mouse events and remove tooltips)
|
Daniel@0
|
121 vc.marks.push({
|
Daniel@0
|
122 "type": "rect",
|
Daniel@0
|
123 "properties": {
|
Daniel@0
|
124 "enter": {
|
Daniel@0
|
125 "x": {"value": -vc.padding.left},
|
Daniel@0
|
126 "y": {"value": -vc.padding.top},
|
Daniel@0
|
127 "fill": {"value": "#fff"},
|
Daniel@0
|
128 "y2": {"field": {"group": "height"}, "offset": vc.padding.left + vc.padding.right},
|
Daniel@0
|
129 "x2": {"field": {"group": "width"}, "offset": vc.padding.top + vc.padding.bottom},
|
Daniel@0
|
130 }
|
Daniel@0
|
131 }
|
Daniel@0
|
132 });
|
Daniel@0
|
133
|
Daniel@0
|
134
|
Daniel@0
|
135 // .............................................................
|
Daniel@0
|
136 // Mark - cells
|
Daniel@0
|
137
|
Daniel@0
|
138 vc.marks.push({
|
Daniel@0
|
139 "type": "rect",
|
Daniel@0
|
140 "from": {"data": "cells"},
|
Daniel@0
|
141 "properties": {
|
Daniel@0
|
142 "enter": {
|
Daniel@0
|
143 "x": {"field": "column", "scale": "column"},
|
Daniel@0
|
144 "x2": {"field": "nextColumn", "scale": "column", "offset": -1},
|
Daniel@0
|
145 "y": {"field": "row", "scale": "row"},
|
Daniel@0
|
146 "y2": {"field": "nextRow", "scale": "row", "offset": -1},
|
Daniel@0
|
147 "fill": {"value": vc.colorForData},
|
Daniel@0
|
148 "fillOpacity": {"field": "distance", "scale": "fillOpacity"},
|
Daniel@0
|
149 }
|
Daniel@0
|
150 }
|
Daniel@0
|
151 });
|
Daniel@0
|
152
|
Daniel@0
|
153 },
|
Daniel@0
|
154 });
|
Daniel@0
|
155 });
|
Daniel@0
|
156 }, Logger);
|