Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Metagenomics
metagenedb
Commits
08744778
Commit
08744778
authored
Dec 02, 2019
by
Kenzo-Hugo Hillion
♻
Browse files
externalize headers of graphs
parent
8d6064a7
Pipeline
#19185
passed with stages
in 2 minutes and 11 seconds
Changes
3
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
frontend/src/components/Doughnut.vue
View file @
08744778
<
template
>
<v-flex
xs12
md6
xl4
>
<v-toolbar
:class=
"doughnutData.class"
dark
v-if=
"doughnutData.data"
>
<v-icon
class=
"white--text"
>
{{
doughnutData
.
icon
}}
</v-icon>
<v-toolbar-title>
{{
doughnutData
.
title
}}
(
{{
doughnutData
.
level
}}
)
</v-toolbar-title>
</v-toolbar>
<v-card
class=
"pa-2"
>
<div
class=
"card-body"
>
<div
v-if=
"doughnutData.data"
>
<canvas
:id=
"this.doughnutData.chartId"
></canvas>
</div>
<div
class=
"text-xs-center"
v-else
>
<v-progress-circular
indeterminate
color=
"secondary"
></v-progress-circular>
</div>
<v-card
class=
"pa-2"
>
<div
class=
"card-body"
>
<div
v-if=
"doughnutData.data"
>
<canvas
:id=
"this.doughnutData.chartId"
></canvas>
</div>
</v-card>
</v-flex>
<div
class=
"text-xs-center"
v-else
>
<v-progress-circular
indeterminate
color=
"secondary"
></v-progress-circular>
</div>
</div>
</v-card>
</
template
>
<
script
>
...
...
frontend/src/components/Histogram.vue
View file @
08744778
<
template
>
<v-flex
xs12
md6
xl4
>
<v-toolbar
:class=
"histoData.class"
dark
v-if=
"histoData.data"
>
<v-icon
class=
"white--text"
>
{{
histoData
.
icon
}}
</v-icon>
<v-toolbar-title>
{{
histoData
.
title
}}
</v-toolbar-title>
</v-toolbar>
<v-card
class=
"pa-2"
>
<div
class=
"card-body"
>
<div
v-if=
"histoData.data"
>
<canvas
:id=
"histoData.chart_id"
></canvas>
</div>
<div
class=
"text-xs-center"
v-else
>
<v-progress-circular
indeterminate
color=
"secondary"
></v-progress-circular>
</div>
<v-card
class=
"pa-2"
>
<div
class=
"card-body"
>
<div
v-if=
"histoData.data"
>
<canvas
:id=
"histoData.chart_id"
></canvas>
</div>
</v-card>
</v-flex>
<div
class=
"text-xs-center"
v-else
>
<v-progress-circular
indeterminate
color=
"secondary"
></v-progress-circular>
</div>
</div>
</v-card>
</
template
>
<
script
>
...
...
frontend/src/views/Stats.vue
View file @
08744778
...
...
@@ -24,8 +24,26 @@
<countcard
:count=
"geneCountFull"
></countcard>
</v-layout>
<v-layout
row
wrap
>
<histogram
:histoData=
"geneLengthData"
></histogram>
<doughnut
:doughnutData=
"taxoCounts"
></doughnut>
<v-flex
xs12
md6
xl4
>
<v-toolbar
class=
"secondary"
dark
>
<v-icon
class=
"white--text"
>
bar_chart
</v-icon>
<v-toolbar-title>
Gene length distribution
</v-toolbar-title>
</v-toolbar>
<histogram
:histoData=
"geneLengthData"
></histogram>
</v-flex>
<v-flex
xs12
md6
xl4
>
<v-toolbar
class=
"secondary"
dark
>
<v-icon
class=
"white--text"
>
account_tree
</v-icon>
<v-toolbar-title>
Taxonomical annotation
</v-toolbar-title>
</v-toolbar>
<doughnut
:doughnutData=
"taxoCounts"
></doughnut>
</v-flex>
</v-layout>
</v-container>
</v-card>
...
...
@@ -75,15 +93,12 @@ export default {
})
.
then
((
response
)
=>
{
this
.
geneLengthData
=
{
chart_id
:
"
histo
1
"
,
chart_id
:
"
histo
_gene_length
"
,
data
:
response
.
data
.
results
.
counts
,
labels
:
response
.
data
.
results
.
labels
,
title
:
"
Gene length distribution
"
,
label
:
"
Number of genes
"
,
borderColor
:
'
#edb183
'
,
backgroundColor
:
'
#f15152
'
,
class
:
"
secondary
"
,
icon
:
"
bar_chart
"
,
};
})
.
catch
((
error
)
=>
{
...
...
@@ -183,12 +198,8 @@ export default {
})
.
then
((
response
)
=>
{
this
.
taxoCounts
=
{
class
:
"
secondary
"
,
icon
:
"
account_tree
"
,
title
:
"
Taxonomical annotation
"
,
data
:
response
.
data
.
results
.
counts
,
level
:
response
.
data
.
results
.
level
,
backgroundColor
:
'
#f15152
'
,
chartId
:
'
taxo_distri
'
,
};
})
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new 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