fix linting issues
This commit is contained in:
parent
36ceb0d1fa
commit
b0694ce8c1
@ -83,7 +83,7 @@ function createResourceUsageChart (container, resourceName, resourceAvail, resou
|
|||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
breakpoint: 680
|
breakpoint: 680
|
||||||
}
|
};
|
||||||
chart.style = "margin: 10px;";
|
chart.style = "margin: 10px;";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -50,13 +50,13 @@ class ResourceChart extends HTMLElement {
|
|||||||
</figure>
|
</figure>
|
||||||
`;
|
`;
|
||||||
this.responsiveStyle = this.shadowRoot.querySelector("#responsive-style");
|
this.responsiveStyle = this.shadowRoot.querySelector("#responsive-style");
|
||||||
this.canvas = this.shadowRoot.querySelector("canvas");
|
this.canvas = this.shadowRoot.querySelector("canvas");
|
||||||
this.caption = this.shadowRoot.querySelector("figcaption");
|
this.caption = this.shadowRoot.querySelector("figcaption");
|
||||||
}
|
}
|
||||||
|
|
||||||
set data (data) {
|
set data (data) {
|
||||||
for (let line of data.title) {
|
for (const line of data.title) {
|
||||||
this.caption.innerHTML += `<span>${line}</span>`
|
this.caption.innerHTML += `<span>${line}</span>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.canvas.role = "img";
|
this.canvas.role = "img";
|
||||||
@ -80,16 +80,16 @@ class ResourceChart extends HTMLElement {
|
|||||||
interaction: {
|
interaction: {
|
||||||
mode: "nearest"
|
mode: "nearest"
|
||||||
},
|
},
|
||||||
onHover: function(e, activeElements) {
|
onHover: function (e, activeElements) {
|
||||||
if (window.innerWidth <= data.breakpoint) {
|
if (window.innerWidth <= data.breakpoint) {
|
||||||
updateTooltipShow(e.chart, false);
|
updateTooltipShow(e.chart, false);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
updateTooltipShow(e.chart, true);
|
updateTooltipShow(e.chart, true);
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
this.chart = createChart(this.canvas, chartData);
|
this.chart = createChart(this.canvas, chartData);
|
||||||
|
|
||||||
@ -107,10 +107,10 @@ class ResourceChart extends HTMLElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function createChart (ctx, data) {
|
function createChart (ctx, data) {
|
||||||
return new Chart(ctx, data);
|
return new window.Chart(ctx, data);
|
||||||
}
|
}
|
||||||
|
|
||||||
// this is a really bad way to do this, but chartjs api does not expose many ways to dynamically set hover and tooltip options
|
// this is a really bad way to do this, but chartjs api does not expose many ways to dynamically set hover and tooltip options
|
||||||
function updateTooltipShow (chart, enabled) {
|
function updateTooltipShow (chart, enabled) {
|
||||||
chart.options.plugins.tooltip.enabled = enabled;
|
chart.options.plugins.tooltip.enabled = enabled;
|
||||||
chart.options.interaction.mode = enabled ? "nearest" : null;
|
chart.options.interaction.mode = enabled ? "nearest" : null;
|
||||||
|
Loading…
Reference in New Issue
Block a user