improve graphics layout
- 'bevel' line style prohibits 'peaks' on locally noisy values - fix option 'stepped' instead of 'steppedLine' - set period to 0 for target parameters - thinker lines, adjustable by a constant
This commit is contained in:
@ -1667,6 +1667,7 @@ function Graph(gindex, container, x_label, y_label, tag, scaleType = "linear"){
|
||||
legend.style.display = 'none';
|
||||
|
||||
let margin = 10;
|
||||
let linewidth = 3;
|
||||
|
||||
canvas.addEventListener('mouseover', function(e){
|
||||
graphs.bringToFront(legend);
|
||||
@ -1719,7 +1720,7 @@ function Graph(gindex, container, x_label, y_label, tag, scaleType = "linear"){
|
||||
function addDataset(key, data, opts){
|
||||
let dataset_index = chart.data.datasets.length;
|
||||
chart.data.datasets.push({data: data, label: opts.label, key: key,
|
||||
spanGaps: false, lineJoin: 'round', borderWidth: 2, steppedLine: opts.period == 0,
|
||||
spanGaps: false, borderJoinStyle: 'bevel', borderWidth: linewidth, stepped: opts.period == 0,
|
||||
borderColor: opts.color,fill: false, pointRadius: 0, tension:0, showLine: true});
|
||||
|
||||
let dataset = chart.data.datasets[dataset_index];
|
||||
@ -1740,6 +1741,7 @@ function Graph(gindex, container, x_label, y_label, tag, scaleType = "linear"){
|
||||
color.appendChild(colorline);
|
||||
colorline.classList.add('colorline');
|
||||
colorline.style.backgroundColor = dataset.borderColor;
|
||||
colorline.style.height = linewidth + 'px';
|
||||
|
||||
dlabel.innerHTML = dataset.label;
|
||||
//dlabel.addEventListener('click', function(evt){
|
||||
@ -1767,13 +1769,13 @@ function Graph(gindex, container, x_label, y_label, tag, scaleType = "linear"){
|
||||
for (ds of chart.data.datasets) {
|
||||
ds.borderWidth = 1;
|
||||
}
|
||||
colorline.style.height = '2px';
|
||||
dataset.borderWidth = 2;
|
||||
colorline.style.height = linewidth + 'px';
|
||||
dataset.borderWidth = linewidth;
|
||||
dlabel.style.fontWeight = 700; // bold
|
||||
} else {
|
||||
if (dataset.borderWidth == 1) {
|
||||
colorline.style.height = '2px';
|
||||
dataset.borderWidth = 2;
|
||||
colorline.style.height = linewidth + 'px';
|
||||
dataset.borderWidth = linewidth;
|
||||
} else {
|
||||
colorline.style.height = '1px';
|
||||
dataset.borderWidth = 1;
|
||||
@ -1783,10 +1785,10 @@ function Graph(gindex, container, x_label, y_label, tag, scaleType = "linear"){
|
||||
}
|
||||
if (allDeselected) {
|
||||
for (ds of chart.data.datasets) {
|
||||
ds.borderWidth = 2;
|
||||
ds.borderWidth = linewidth;
|
||||
}
|
||||
for (let k in legendlines) {
|
||||
legendlines[k].style.height = '2px';
|
||||
legendlines[k].style.height = linewidth + 'px';
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1925,10 +1927,10 @@ function Graph(gindex, container, x_label, y_label, tag, scaleType = "linear"){
|
||||
linlog.innerHTML = "<strong>☒</strong> log";
|
||||
}
|
||||
chart.options.scales.y.type = type;
|
||||
chart.options.animation.duration = 800;
|
||||
//chart.options.animation.duration = 800;
|
||||
if (autoScaleFlag) graphs.autoScale(chart);
|
||||
update();
|
||||
setTimeout(function(){chart.options.animation.duration = 0;},850)
|
||||
//setTimeout(function(){chart.options.animation.duration = 0;},850)
|
||||
}
|
||||
|
||||
/**
|
||||
|
24
influxdb.py
24
influxdb.py
@ -496,13 +496,16 @@ class InfluxDataGetter:
|
||||
fields = [record.get_value() for record in records]
|
||||
for param in variable["params"].keys():
|
||||
if param+"_float" in fields:
|
||||
res.append({
|
||||
curve = {
|
||||
"name": variable["name"] if param == "value" else variable["name"]+"."+param,
|
||||
"label": variable["label"] if param == "value" else variable["label"]+"."+param,
|
||||
"cat": variable["params"][param]["cat"],
|
||||
"color": variable["params"][param]["color"],
|
||||
"unit": variable["params"][param]["unit"]
|
||||
})
|
||||
"unit": variable["params"][param]["unit"],
|
||||
}
|
||||
if param == 'target':
|
||||
curve['period'] = 0
|
||||
res.append(curve)
|
||||
|
||||
return res
|
||||
|
||||
@ -521,16 +524,11 @@ class InfluxDataGetter:
|
||||
groups = {}
|
||||
|
||||
for available_variable in available_variables:
|
||||
key = available_variable["unit"]
|
||||
if available_variable["cat"] != "*":
|
||||
key = available_variable["cat"]
|
||||
unit = available_variable.pop("unit")
|
||||
key = available_variable.pop("cat").replace("*", unit)
|
||||
if key not in groups.keys():
|
||||
groups[key] = {"tag":key, "unit":available_variable["unit"], "curves":[]}
|
||||
groups[key]["curves"].append({
|
||||
"name":available_variable["name"],
|
||||
"label":available_variable["label"],
|
||||
"color":available_variable["color"],
|
||||
})
|
||||
groups[key] = {"tag":key, "unit": unit, "curves":[]}
|
||||
groups[key]["curves"].append(available_variable)
|
||||
|
||||
return list(groups.values())
|
||||
|
||||
@ -721,4 +719,4 @@ class InfluxDataGetter:
|
||||
return seconds * 1000000000
|
||||
|
||||
def _milliseconds_to_nanoseconds(self, milliseconds):
|
||||
return milliseconds * 1000000
|
||||
return milliseconds * 1000000
|
||||
|
Reference in New Issue
Block a user