mirror/wakapi
1
0
Fork 0
mirror of https://github.com/muety/wakapi.git synced 2023-08-10 21:12:56 +03:00
Code Issues Projects Releases Wiki Activity

Only show top 10 items in graph.

Browse Source
This commit is contained in:
Ferdinand Mütsch 2019-07-07 11:17:45 +02:00
parent 8a3ce596f5
commit 5e1493ba36
1 changed files with 30 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
static/index.html
View File

@ -86,6 +86,8 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.min.js"></script>
<script> <script>
const SHOW_TOP_N = 10
const projectsCanvas = document.getElementById("chart-projects") const projectsCanvas = document.getElementById("chart-projects")
const osCanvas = document.getElementById("chart-os") const osCanvas = document.getElementById("chart-os")
const editorsCanvas = document.getElementById("chart-editor") const editorsCanvas = document.getElementById("chart-editor")
@ -154,6 +156,7 @@
type: 'horizontalBar', type: 'horizontalBar',
data: { data: {
datasets: data.projects datasets: data.projects
.slice(0, Math.min(SHOW_TOP_N, data.projects.length))
.map(p => { .map(p => {
return { return {
label: p.key, label: p.key,
@ -163,7 +166,7 @@
}) })
}, },
options: { options: {
title: Object.assign(titleOptions, { text: 'Projects' }), title: Object.assign(titleOptions, { text: `Projects (top ${SHOW_TOP_N})` }),
tooltips: getTooltipOptions('projects', 'bar'), tooltips: getTooltipOptions('projects', 'bar'),
legend: { legend: {
display: false display: false
@ -175,13 +178,17 @@
type: 'pie', type: 'pie',
data: { data: {
datasets: [{ datasets: [{
data: data.operating_systems.map(p => parseInt(p.total)), data: data.operating_systems
.slice(0, Math.min(SHOW_TOP_N, data.operating_systems.length))
.map(p => parseInt(p.total)),
backgroundColor: data.operating_systems.map(p => getRandomColor(p.key)) backgroundColor: data.operating_systems.map(p => getRandomColor(p.key))
}], }],
labels: data.operating_systems.map(p => p.key) labels: data.operating_systems
.slice(0, Math.min(SHOW_TOP_N, data.operating_systems.length))
.map(p => p.key)
}, },
options: { options: {
title: Object.assign(titleOptions, { text: 'Operating Systems' }), title: Object.assign(titleOptions, { text: `Operating Systems (top ${SHOW_TOP_N})` }),
tooltips: getTooltipOptions('operating_systems', 'pie') tooltips: getTooltipOptions('operating_systems', 'pie')
} }
}); });
@ -190,13 +197,17 @@
type: 'pie', type: 'pie',
data: { data: {
datasets: [{ datasets: [{
data: data.editors.map(p => parseInt(p.total)), data: data.editors
.slice(0, Math.min(SHOW_TOP_N, data.editors.length))
.map(p => parseInt(p.total)),
backgroundColor: data.editors.map(p => getRandomColor(p.key)) backgroundColor: data.editors.map(p => getRandomColor(p.key))
}], }],
labels: data.editors.map(p => p.key) labels: data.editors
.slice(0, Math.min(SHOW_TOP_N, data.editors.length))
.map(p => p.key)
}, },
options: { options: {
title: Object.assign(titleOptions, { text: 'Editors' }), title: Object.assign(titleOptions, { text: `Editors (top ${SHOW_TOP_N})` }),
tooltips: getTooltipOptions('editors', 'pie') tooltips: getTooltipOptions('editors', 'pie')
} }
}); });
@ -206,14 +217,16 @@
data: { data: {
datasets: [{ datasets: [{
data: data.languages data: data.languages
.slice(0, Math.min(SHOW_TOP_N, data.languages.length))
.map(p => parseInt(p.total)), .map(p => parseInt(p.total)),
backgroundColor: data.languages.map(p => getRandomColor(p.key)) backgroundColor: data.languages.map(p => getRandomColor(p.key))
}], }],
labels: data.languages labels: data.languages
.slice(0, Math.min(SHOW_TOP_N, data.languages.length))
.map(p => p.key) .map(p => p.key)
}, },
options: { options: {
title: Object.assign(titleOptions, { text: 'Languages' }), title: Object.assign(titleOptions, { text: `Languages (top ${SHOW_TOP_N})` }),
tooltips: getTooltipOptions('languages', 'pie') tooltips: getTooltipOptions('languages', 'pie')
} }
}); });