a
/
gosora
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Reduce the number of labels to reduce the amount of clutter another way.

This commit is contained in:
Azareal 2019-05-08 15:56:18 +10:00
parent 3023f3c138
commit 1fd980bf56
4 changed files with 51 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
public/analytics.js
View File

@ -39,12 +39,14 @@ function buildStatsChart(rawLabels, seriesData, timeRange, legendNames, bytes =
} else if(timeRange=="three-months") {
labels = [aphrases["analytics.now"],"3" + aphrases["analytics.days_short"]]
for(let i = 6; i < 90; i = i + 3) {
labels.push(i + aphrases["analytics.days_short"]);
if (i%2==0) labels.push("");
else labels.push(i + aphrases["analytics.days_short"]);
}
} else if(timeRange=="one-month") {
labels = [aphrases["analytics.now"],"1" + aphrases["analytics.days_short"]];
for(let i = 2; i < 30; i++) {
labels.push(i + aphrases["analytics.days_short"]);
if (i%2==0) labels.push("");
else labels.push(i + aphrases["analytics.days_short"]);
}
} else if(timeRange=="one-week") {
labels = [aphrases["analytics.now"]];
@ -52,6 +54,19 @@ function buildStatsChart(rawLabels, seriesData, timeRange, legendNames, bytes =
if (i%2==0) labels.push("");
else labels.push(Math.floor(i/2) + aphrases["analytics.days"]);
}
} else if (timeRange=="two-days" || timeRange == "one-day" || timeRange == "twelve-hours") {
for(const i in rawLabels) {
if (i%2==0) {
labels.push("");
continue;
}
let date = new Date(rawLabels[i]*1000);
console.log("date: ", date);
let minutes = "0" + date.getMinutes();
let label = date.getHours() + ":" + minutes.substr(-2);
console.log("label:", label);
labels.push(label);
}
} else {
for(const i in rawLabels) {
let date = new Date(rawLabels[i]*1000);

24
templates/panel_analytics_memory.html
View File

@ -80,20 +80,24 @@
};
}(window, document, Chartist));
const noPre = ["twelve-hours","one-day","two-days","one-week","one-month"];
const preStats = () => {
if((!"{{.TimeRange}}" in noPre) && seriesData.length > 0 && seriesData[0].length > 12) {
let elem = document.getElementsByClassName("colstack_graph_holder")[0];
let w = elem.clientWidth;
console.log("w:",w);
elem.classList.add("scrolly");
console.log("elem.clientWidth:",elem.clientWidth);
elem.setAttribute("style","width:"+w+"px;");
console.log("elem.clientWidth:",elem.clientWidth);
}
};
addInitHook("after_phrases", () => {
addInitHook("end_init", () => {
addInitHook("analytics_loaded", () => {
if("{{.TimeRange}}" != "one-week" && seriesData.length > 0 && seriesData[0].length > 12) {
let elem = document.getElementsByClassName("colstack_graph_holder")[0];
let w = elem.clientWidth;
console.log("w:",w);
elem.classList.add("scrolly");
console.log("elem.clientWidth:",elem.clientWidth);
elem.setAttribute("style","width:"+w+"px;");
console.log("elem.clientWidth:",elem.clientWidth);
}
preStats();
buildStatsChart(rawLabels, seriesData, "{{.TimeRange}}",legendNames,true);
});
});
});
});
</script>

22
templates/panel_analytics_script.html
View File

@ -10,18 +10,22 @@ let seriesData = [{{range .Graph.Series}}[{{range .}}
let legendNames = [{{range .Graph.Legends}}
{{.}},{{end}}
];
const noPre = ["twelve-hours","one-day","two-days","one-week","one-month"];
const preStats = () => {
if((!"{{.TimeRange}}" in noPre) && seriesData.length > 0 && seriesData[0].length > 12) {
let elem = document.getElementsByClassName("colstack_graph_holder")[0];
let w = elem.clientWidth;
console.log("w:",w);
elem.classList.add("scrolly");
console.log("elem.clientWidth:",elem.clientWidth);
elem.setAttribute("style","width:"+w+"px;");
console.log("elem.clientWidth:",elem.clientWidth);
}
};
addInitHook("after_phrases", () => {
addInitHook("end_init", () => {
addInitHook("analytics_loaded", () => {
if("{{.TimeRange}}" != "one-week" && seriesData.length > 0 && seriesData[0].length > 12) {
let elem = document.getElementsByClassName("colstack_graph_holder")[0];
let w = elem.clientWidth;
console.log("w:",w);
elem.classList.add("scrolly");
console.log("elem.clientWidth:",elem.clientWidth);
elem.setAttribute("style","width:"+w+"px;");
console.log("elem.clientWidth:",elem.clientWidth);
}
preStats();
buildStatsChart(rawLabels, seriesData, "{{.TimeRange}}",legendNames);
});
});

7
themes/cosora/public/panel.css
View File

@ -269,6 +269,13 @@
margin-left: 16px;
padding-top: 16px;
}
.colstack_graph_holder.scrolly {
overflow-x: scroll;
width: 800px;
}
.colstack_graph_holder.scrolly .ct_chart {
width: 1000px;
}
.ct-series-a .ct-bar, .ct-series-a .ct-line, .ct-series-a .ct-point, .ct-series-a .ct-slice-donut {
stroke: hsl(359,98%,53%) !important;
}