Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Feature/modify graph view #75

Open
wants to merge 6 commits into
base: main
Choose a base branch
from
Open

Feature/modify graph view #75

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
aa7186b
remove tick labels
crsct Dec 4, 2023
af1e302
adjust margin and add explanation to the graphs
crsct Dec 4, 2023
dd55168
add description to second graph
crsct Dec 4, 2023
f6c754e
explain logarithmic scale
crsct Dec 4, 2023
62d1e35
improve descriptions of the charts
crsct Dec 5, 2023
7db094e
fix typos
crsct Dec 19, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions src/views/statistics/PhylogenyCountsBarchart.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,12 @@ data.push({

const layout: Partial<Layout> = {
height: 800,
margin: {
t: 50,
},
yaxis: {
automargin: true,
showticklabels: false,
},
xaxis: {
type: "log",
Expand Down
24 changes: 23 additions & 1 deletion src/views/statistics/StatisticsView.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,10 +47,32 @@ state.value.setState(State.Loading);
<RepositoryStatistics :entries="summaryData" />
</div>
<div>
<h3 class="ps-5">Genus Composition:</h3>
<h3 class="ps-5 pt-2">Genus Composition:</h3>
<p class="px-5">
This graph displays the genus composition of the bakrep dataset, the
crsct marked this conversation as resolved.
Show resolved Hide resolved
y-axis shows the different genus while the x-axis displays how often a
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The genera are sorted according to their entry count and [presented or better word] on the y-axis.

sample of that genus is found in the database. The x axis is
logarithmic, which results in the stair case effect you can see, since
crsct marked this conversation as resolved.
Show resolved Hide resolved
there are more samples that are found just a few times than those that
are plentiful.
</p>
<p class="px-5">
Both graphs are interactive, hovering over a bar will reveal the genus
crsct marked this conversation as resolved.
Show resolved Hide resolved
that is selected. It is also possible to select a zoom rectangle by
simply dragging inside the graph. More options are available once you
hover your mouse inside the graph panel.
</p>
<PhylogenyCountsBarChart :inputData="genusData" />
</div>
<div>
<p class="px-5">
This graph displays the species composition of the bakrep dataset, the
crsct marked this conversation as resolved.
Show resolved Hide resolved
y-axis shows the different species while the x-axis displays how often a
sample of that species is found in the database.The x axis is
logarithmic, which results in the stair case effect you can see, since
there are more samples that are found just a few times than those that
are plentiful.
</p>
<h3 class="ps-5">Species Composition:</h3>
<PhylogenyCountsBarChart :inputData="speciesData" />
</div>
Expand Down