Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
vig
Sublinear Algorithms for VA
pseudo
Commits
c9ba36ac
Commit
c9ba36ac
authored
Jul 20, 2020
by
Kruyff,D.L.W. (Dylan)
Browse files
Use tabs and store labeled indices
parent
75131a3a
Changes
17
Hide whitespace changes
Inline
Side-by-side
AngularApp/prototype/src/app/app.component.html
View file @
c9ba36ac
<div
style=
"display: flex"
>
<div
style=
"width: 70%"
>
<app-settings></app-settings>
<app-overview-window></app-overview-window>
<app-overview-window></app-overview-window>
<mat-tab-group
animationDuration=
"0ms"
>
<mat-tab
label=
"Query"
>
<app-query-window></app-query-window>
</mat-tab>
<mat-tab
label=
"Samples"
>
<app-labeling-window></app-labeling-window>
</
div
>
<
div
style=
"width: 30%
"
>
</
mat-tab
>
<
mat-tab
label=
"Hashtables
"
>
<app-table-overview></app-table-overview>
</div>
</div>
</mat-tab>
<mat-tab
label=
"Labeled data"
>
<app-labels></app-labels>
</mat-tab>
<mat-tab
label=
"Settings"
>
<app-settings></app-settings>
</mat-tab>
</mat-tab-group>
AngularApp/prototype/src/app/app.module.ts
View file @
c9ba36ac
...
...
@@ -12,6 +12,8 @@ import { LabelingWindowComponent } from './labeling-window/labeling-window.compo
import
{
TableOverviewComponent
}
from
'
./table-overview/table-overview.component
'
;
import
{
BrowserAnimationsModule
}
from
'
@angular/platform-browser/animations
'
;
import
{
MatTabsModule
}
from
'
@angular/material/tabs
'
;
import
{
LabelsComponent
}
from
'
./labels/labels.component
'
;
import
{
QueryWindowComponent
}
from
'
./query-window/query-window.component
'
;
PlotlyModule
.
plotlyjs
=
PlotlyJS
;
...
...
@@ -22,6 +24,8 @@ PlotlyModule.plotlyjs = PlotlyJS;
OverviewWindowComponent
,
LabelingWindowComponent
,
TableOverviewComponent
,
LabelsComponent
,
QueryWindowComponent
,
],
imports
:
[
BrowserModule
,
...
...
AngularApp/prototype/src/app/cache.service.ts
View file @
c9ba36ac
...
...
@@ -7,16 +7,20 @@ import {ApiService, RawData} from './api.service';
export
class
CacheService
{
public
rawValues
:
number
[];
public
rawIndices
:
string
[];
public
windows
:
number
[][];
public
hashFunctions
;
public
tables
;
public
windowSimilarity
;
public
_windows
:
number
[][];
private
_query
=
undefined
;
public
_labels
=
{};
public
_tables
;
public
_windowSimilarity
;
public
windowSize
=
20
;
public
nrOfTables
=
10
;
public
hashSize
=
10
;
public
onQuery
:
EventEmitter
<
void
>
=
new
EventEmitter
<
void
>
();
public
onNewSimilarity
:
EventEmitter
<
void
>
=
new
EventEmitter
<
void
>
();
public
onNewLabels
:
EventEmitter
<
void
>
=
new
EventEmitter
<
void
>
();
public
onNewQuery
:
EventEmitter
<
void
>
=
new
EventEmitter
<
void
>
();
public
onNewTables
:
EventEmitter
<
void
>
=
new
EventEmitter
<
void
>
();
public
onNewWindows
:
EventEmitter
<
void
>
=
new
EventEmitter
<
void
>
();
...
...
@@ -47,25 +51,66 @@ export class CacheService {
async
getWindows
():
Promise
<
void
>
{
this
.
windows
=
await
this
.
api
.
createWindows
(
this
.
rawValues
,
this
.
parameters
);
this
.
onNewWindows
.
emit
();
}
async
createTables
():
Promise
<
void
>
{
this
.
tables
=
await
this
.
api
.
createTables
(
this
.
windows
,
this
.
parameters
);
this
.
onNewTables
.
emit
();
}
async
getSimilarWindows
(
window
):
Promise
<
any
>
{
this
.
windowSimilarity
=
await
this
.
api
.
getSimilarWindows
(
window
,
this
.
tables
);
this
.
onQuery
.
emit
();
return
this
.
windowSimilarity
;
}
async
updateTables
(
labeldata
):
Promise
<
void
>
{
this
.
tables
=
await
this
.
api
.
updateTables
(
this
.
windows
,
labeldata
,
this
.
tables
,
this
.
parameters
);
async
updateTables
():
Promise
<
void
>
{
this
.
tables
=
await
this
.
api
.
updateTables
(
this
.
windows
,
this
.
labels
,
this
.
tables
,
this
.
parameters
);
}
public
set
query
(
v
)
{
this
.
_query
=
v
;
this
.
onNewQuery
.
emit
();
}
public
get
query
():
number
{
return
this
.
_query
;
}
public
set
windows
(
v
)
{
this
.
_windows
=
v
;
this
.
onNewWindows
.
emit
();
}
public
get
windows
():
number
[][]
{
return
this
.
_windows
;
}
public
set
tables
(
v
)
{
this
.
_tables
=
v
;
this
.
onNewTables
.
emit
();
}
public
get
tables
()
{
return
this
.
_tables
;
}
public
set
labels
(
v
)
{
this
.
_labels
=
v
;
this
.
onNewLabels
.
emit
();
}
public
get
labels
()
{
return
this
.
_labels
;
}
public
set
windowSimilarity
(
v
)
{
this
.
_windowSimilarity
=
v
;
this
.
onNewSimilarity
.
emit
();
}
public
get
windowSimilarity
()
{
return
this
.
_windowSimilarity
;
}
public
get
parameters
():
{[
parameter
:
string
]:
any
}
{
return
{
windowsize
:
this
.
windowSize
,
...
...
AngularApp/prototype/src/app/labeling-window/labeling-window.component.css
View file @
c9ba36ac
...
...
@@ -3,6 +3,11 @@
width
:
150px
;
}
.subplot-container
{
display
:
flex
;
overflow
:
auto
;
}
button
{
padding
:
0
20px
;
}
...
...
AngularApp/prototype/src/app/labeling-window/labeling-window.component.html
View file @
c9ba36ac
<div
*ngIf=
"windowSimilarity"
style=
"display: flex
"
>
<div
*ngIf=
"windowSimilarity"
class=
"subplot-container
"
>
<div
class=
"subplot"
*ngFor=
"let subplot of subplots"
>
<plotly-plot
[data]=
"subplot.data"
[layout]=
"subplot.layout"
></plotly-plot>
<div
class=
"button-holder"
>
...
...
AngularApp/prototype/src/app/labeling-window/labeling-window.component.ts
View file @
c9ba36ac
...
...
@@ -15,11 +15,12 @@ export class LabelingWindowComponent implements OnInit {
constructor
(
private
service
:
CacheService
)
{
}
ngOnInit
():
void
{
this
.
service
.
on
Quer
y
.
subscribe
(()
=>
{
this
.
getTopKSimilar
();
});
this
.
service
.
on
NewSimilarit
y
.
subscribe
(()
=>
{
this
.
getTopKSimilar
();
});
}
public
changeTables
()
{
this
.
service
.
updateTables
(
this
.
labels
);
this
.
service
.
labels
=
Object
.
assign
({},
this
.
service
.
labels
,
this
.
labels
);
this
.
service
.
updateTables
();
}
public
get
windowSimilarity
()
{
...
...
@@ -42,6 +43,9 @@ export class LabelingWindowComponent implements OnInit {
public
getTopKSimilar
()
{
this
.
labels
=
[];
if
(
!
this
.
windowSimilarity
)
{
return
;
}
let
topk
=
[];
let
k
=
this
.
k
;
const
keys
=
Object
.
keys
(
this
.
windowSimilarity
).
map
(
a
=>
Number
(
a
)).
sort
((
a
,
b
)
=>
b
-
a
);
...
...
@@ -62,10 +66,6 @@ export class LabelingWindowComponent implements OnInit {
this
.
subplots
=
[];
for
(
const
window
of
this
.
topk
)
{
console
.
log
(
this
.
service
.
rawValues
);
console
.
log
(
window
.
index
);
console
.
log
(
this
.
service
.
windowSize
);
console
.
log
(
this
.
service
.
rawValues
.
slice
(
window
.
index
,
window
.
index
+
this
.
service
.
windowSize
));
this
.
subplots
.
push
(
{
index
:
window
.
index
,
...
...
@@ -93,7 +93,5 @@ export class LabelingWindowComponent implements OnInit {
}
);
}
console
.
log
(
this
.
topk
);
console
.
log
(
this
.
subplots
);
}
}
AngularApp/prototype/src/app/labels/labels.component.css
0 → 100644
View file @
c9ba36ac
.subplot
{
margin-right
:
20px
;
width
:
150px
;
}
.good-labels
{
padding
:
5px
;
display
:
flex
;
overflow
:
auto
;
background-color
:
rgba
(
76
,
175
,
80
,
0.5
);
}
.bad-labels
{
padding
:
5px
;
display
:
flex
;
overflow
:
auto
;
background-color
:
rgba
(
244
,
67
,
54
,
0.5
);
}
AngularApp/prototype/src/app/labels/labels.component.html
0 → 100644
View file @
c9ba36ac
<div
class=
"good-labels"
*ngIf=
"goodLabels.length > 0"
>
<div
class=
"subplot"
*ngFor=
"let subplot of goodLabels"
>
<plotly-plot
[data]=
"subplot.data"
[layout]=
"subplot.layout"
></plotly-plot>
</div>
</div>
<div
class=
"bad-labels"
*ngIf=
"badLabels.length > 0"
>
<div
class=
"subplot"
*ngFor=
"let subplot of badLabels"
>
<plotly-plot
[data]=
"subplot.data"
[layout]=
"subplot.layout"
></plotly-plot>
</div>
</div>
AngularApp/prototype/src/app/labels/labels.component.ts
0 → 100644
View file @
c9ba36ac
import
{
Component
,
OnInit
}
from
'
@angular/core
'
;
import
{
CacheService
}
from
'
../cache.service
'
;
@
Component
({
selector
:
'
app-labels
'
,
templateUrl
:
'
./labels.component.html
'
,
styleUrls
:
[
'
./labels.component.css
'
]
})
export
class
LabelsComponent
implements
OnInit
{
public
goodLabels
=
[];
public
badLabels
=
[];
constructor
(
private
service
:
CacheService
)
{
}
ngOnInit
():
void
{
this
.
service
.
onNewLabels
.
subscribe
(()
=>
{
this
.
createSubplots
();
});
}
createSubplots
():
void
{
this
.
goodLabels
=
[];
this
.
badLabels
=
[];
console
.
log
(
this
.
service
.
labels
);
for
(
const
key
of
Object
.
keys
(
this
.
service
.
labels
))
{
const
index
=
Number
(
key
);
const
plot
=
{
index
,
data
:
[{
x
:
this
.
service
.
rawIndices
.
slice
(
index
,
index
+
this
.
service
.
windowSize
),
y
:
this
.
service
.
rawValues
.
slice
(
index
,
index
+
this
.
service
.
windowSize
),
type
:
'
line
'
}],
layout
:
{
title
:
`Index:
${
index
.
toString
()}
`
,
hovermode
:
'
closest
'
,
autosize
:
true
,
margin
:
{
l
:
30
,
r
:
30
,
t
:
30
,
pad
:
4
},
height
:
200
,
width
:
150
,
titlefont
:
{
size
:
9
},
}
};
if
(
this
.
service
.
labels
[
key
])
{
this
.
goodLabels
.
push
(
plot
);
}
else
{
this
.
badLabels
.
push
(
plot
);
}
}
}
}
AngularApp/prototype/src/app/overview-window/overview-window.component.ts
View file @
c9ba36ac
...
...
@@ -11,7 +11,6 @@ export class OverviewWindowComponent implements OnInit {
public
defaultColors
:
string
[]
=
[];
public
defaultSizes
:
number
[]
=
[];
public
defaultOpacity
:
number
[]
=
[];
public
selectedIndex
:
number
;
public
showPlot
=
false
;
public
data
;
...
...
@@ -22,14 +21,14 @@ export class OverviewWindowComponent implements OnInit {
async
ngOnInit
():
Promise
<
void
>
{
this
.
service
.
onNewWindows
.
subscribe
(()
=>
{
this
.
initializePlot
();
});
this
.
service
.
onNewTables
.
subscribe
(()
=>
{
if
(
this
.
se
lectedIndex
)
{
if
(
this
.
se
rvice
.
query
)
{
this
.
updatePlot
();
}
});
}
async
initializePlot
()
{
this
.
se
lectedIndex
=
undefined
;
this
.
se
rvice
.
query
=
undefined
;
for
(
const
_
of
this
.
service
.
rawValues
)
{
this
.
defaultColors
.
push
(
'
#a3a7e4
'
);
this
.
defaultSizes
.
push
(
5
);
...
...
@@ -55,14 +54,16 @@ export class OverviewWindowComponent implements OnInit {
pad
:
4
},
height
:
200
,
width
:
screen
.
width
*
0.7
};
this
.
showPlot
=
true
;
}
async
clicked
(
clickData
)
{
for
(
const
point
of
clickData
.
points
)
{
this
.
selectedIndex
=
point
.
pointNumber
;
this
.
service
.
query
=
point
.
pointNumber
;
const
temp
=
{};
temp
[
point
.
pointNumber
]
=
true
;
this
.
service
.
labels
=
temp
;
}
await
this
.
updatePlot
();
}
...
...
@@ -72,7 +73,7 @@ export class OverviewWindowComponent implements OnInit {
const
sizes
:
number
[]
=
[];
const
opacity
:
number
[]
=
[];
const
windowSimilarity
=
await
this
.
service
.
getSimilarWindows
(
this
.
service
.
windows
[
this
.
se
lectedIndex
]);
const
windowSimilarity
=
await
this
.
service
.
getSimilarWindows
(
this
.
service
.
windows
[
this
.
se
rvice
.
query
]);
for
(
const
frequency
in
windowSimilarity
){
for
(
const
index
of
windowSimilarity
[
frequency
])
{
colors
[
index
]
=
this
.
getColor
(
Number
(
frequency
)
/
this
.
service
.
nrOfTables
);
...
...
AngularApp/prototype/src/app/query-window/query-window.component.css
0 → 100644
View file @
c9ba36ac
AngularApp/prototype/src/app/query-window/query-window.component.html
0 → 100644
View file @
c9ba36ac
<div
*ngIf=
"!query"
>
Select a point in the data to start the similarity search.
</div>
<div
*ngIf=
"query"
>
<plotly-plot
[data]=
"plot.data"
[layout]=
"plot.layout"
></plotly-plot>
</div>
AngularApp/prototype/src/app/query-window/query-window.component.ts
0 → 100644
View file @
c9ba36ac
import
{
Component
,
OnInit
}
from
'
@angular/core
'
;
import
{
CacheService
}
from
'
../cache.service
'
;
@
Component
({
selector
:
'
app-query-window
'
,
templateUrl
:
'
./query-window.component.html
'
,
styleUrls
:
[
'
./query-window.component.css
'
]
})
export
class
QueryWindowComponent
implements
OnInit
{
public
plot
;
constructor
(
private
service
:
CacheService
)
{
}
ngOnInit
():
void
{
this
.
service
.
onNewQuery
.
subscribe
(()
=>
{
if
(
this
.
service
.
query
)
{
this
.
initializePlot
();
}
});
}
initializePlot
():
void
{
this
.
plot
=
{
index
:
this
.
service
.
query
,
data
:
[{
x
:
this
.
service
.
rawIndices
.
slice
(
this
.
service
.
query
,
this
.
service
.
query
+
this
.
service
.
windowSize
),
y
:
this
.
service
.
rawValues
.
slice
(
this
.
service
.
query
,
this
.
service
.
query
+
this
.
service
.
windowSize
),
type
:
'
line
'
}],
layout
:
{
title
:
`Index:
${
this
.
service
.
query
.
toString
()}
`
,
hovermode
:
'
closest
'
,
autosize
:
true
,
margin
:
{
l
:
30
,
r
:
30
,
t
:
30
,
pad
:
4
},
height
:
200
,
width
:
150
,
titlefont
:
{
size
:
9
},
}
};
}
get
query
():
number
{
return
this
.
service
.
query
;
}
}
AngularApp/prototype/src/app/table-overview/table-overview.component.css
View file @
c9ba36ac
.window
{
width
:
450px
;
width
:
100%
;
display
:
flex
;
flex-wrap
:
wrap
;
}
...
...
Flaskserver/.idea/workspace.xml
View file @
c9ba36ac
...
...
@@ -3,8 +3,14 @@
<component
name=
"ChangeListManager"
>
<list
default=
"true"
id=
"556080ba-825c-4b55-a92a-867a4df4fb32"
name=
"Default Changelist"
comment=
""
>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/app.component.html"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/app.component.html"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/app.component.ts"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/app.component.ts"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/app.module.ts"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/app.module.ts"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/cache.service.ts"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/cache.service.ts"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/labeling-window/labeling-window.component.css"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/labeling-window/labeling-window.component.css"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/labeling-window/labeling-window.component.html"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/labeling-window/labeling-window.component.html"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/labeling-window/labeling-window.component.ts"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/labeling-window/labeling-window.component.ts"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/table-overview/table-overview.component.css"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/../AngularApp/prototype/src/app/table-overview/table-overview.component.css"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/.idea/workspace.xml"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/.idea/workspace.xml"
afterDir=
"false"
/>
<change
beforePath=
"$PROJECT_DIR$/main.py"
beforeDir=
"false"
afterPath=
"$PROJECT_DIR$/main.py"
afterDir=
"false"
/>
</list>
<option
name=
"EXCLUDED_CONVERTED_TO_IGNORED"
value=
"true"
/>
<option
name=
"SHOW_DIALOG"
value=
"false"
/>
...
...
@@ -17,8 +23,8 @@
<file
pinned=
"false"
current-in-tab=
"true"
>
<entry
file=
"file://$PROJECT_DIR$/main.py"
>
<provider
selected=
"true"
editor-type-id=
"text-editor"
>
<state
relative-caret-position=
"
1080
"
>
<caret
line=
"1
42
"
column=
"
43"
lean-forward=
"true
"
selection-start-line=
"1
42
"
selection-start-column=
"
43
"
selection-end-line=
"1
42
"
selection-end-column=
"
43
"
/>
<state
relative-caret-position=
"
227
"
>
<caret
line=
"1
06
"
column=
"
25
"
selection-start-line=
"1
06
"
selection-start-column=
"
25
"
selection-end-line=
"1
06
"
selection-end-column=
"
25
"
/>
<folding>
<element
signature=
"e#0#41#0"
expanded=
"true"
/>
</folding>
...
...
@@ -38,7 +44,7 @@
</list>
</option>
</component>
<component
name=
"ProjectFrameBounds"
extendedState=
"
6
"
>
<component
name=
"ProjectFrameBounds"
extendedState=
"
7
"
>
<option
name=
"x"
value=
"12"
/>
<option
name=
"y"
value=
"-36"
/>
<option
name=
"width"
value=
"1890"
/>
...
...
@@ -116,17 +122,18 @@
<workItem
from=
"1594494759659"
duration=
"1411000"
/>
<workItem
from=
"1594589515579"
duration=
"1044000"
/>
<workItem
from=
"1594719112139"
duration=
"10388000"
/>
<workItem
from=
"1595247298901"
duration=
"1773000"
/>
</task>
<servers
/>
</component>
<component
name=
"TimeTrackingManager"
>
<option
name=
"totallyTimeSpent"
value=
"1
6749
000"
/>
<option
name=
"totallyTimeSpent"
value=
"1
8522
000"
/>
</component>
<component
name=
"ToolWindowManager"
>
<frame
x=
"-7"
y=
"-7"
width=
"1295"
height=
"695"
extended-state=
"7"
/>
<editor
active=
"true"
/>
<layout>
<window_info
active=
"true"
content_ui=
"combo"
id=
"Project"
order=
"0"
visible=
"true"
weight=
"0.26
273242
"
/>
<window_info
active=
"true"
content_ui=
"combo"
id=
"Project"
order=
"0"
visible=
"true"
weight=
"0.26
677445
"
/>
<window_info
id=
"Structure"
order=
"1"
side_tool=
"true"
weight=
"0.25"
/>
<window_info
id=
"Favorites"
order=
"2"
side_tool=
"true"
/>
<window_info
anchor=
"bottom"
id=
"Message"
order=
"0"
/>
...
...
@@ -155,8 +162,8 @@
<component
name=
"editorHistoryManager"
>
<entry
file=
"file://$PROJECT_DIR$/main.py"
>
<provider
selected=
"true"
editor-type-id=
"text-editor"
>
<state
relative-caret-position=
"
1080
"
>
<caret
line=
"1
42
"
column=
"
43"
lean-forward=
"true
"
selection-start-line=
"1
42
"
selection-start-column=
"
43
"
selection-end-line=
"1
42
"
selection-end-column=
"
43
"
/>
<state
relative-caret-position=
"
227
"
>
<caret
line=
"1
06
"
column=
"
25
"
selection-start-line=
"1
06
"
selection-start-column=
"
25
"
selection-end-line=
"1
06
"
selection-end-column=
"
25
"
/>
<folding>
<element
signature=
"e#0#41#0"
expanded=
"true"
/>
</folding>
...
...
Flaskserver/__pycache__/main.cpython-38.pyc
View file @
c9ba36ac
No preview for this file type
Flaskserver/main.py
View file @
c9ba36ac
...
...
@@ -108,8 +108,8 @@ def update():
table_size
=
int
(
raw_data
[
'parameters'
][
"tablesize"
])
new_tables
=
[]
correct_indices
=
[
index
for
index
,
value
in
enumerate
(
label_data
)
if
value
is
True
]
incorrect_indices
=
[
index
for
index
,
value
in
enumerate
(
label_data
)
if
value
is
False
]
correct_indices
=
[
int
(
index
)
for
index
,
value
in
label_data
.
items
(
)
if
value
is
True
]
incorrect_indices
=
[
int
(
index
)
for
index
,
value
in
label_data
.
items
(
)
if
value
is
False
]
window
=
data
[
correct_indices
[
0
]]
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment