Handle zoomed event

pull/315/head
robinknaapen 2019-12-04 15:41:40 +01:00
parent 8169b30f3f
commit f5b5695486
No known key found for this signature in database
GPG Key ID: 45A8E203AF859FD8
1 changed files with 21 additions and 2 deletions

View File

@ -318,6 +318,21 @@ var heat_options = {
} }
}; };
async function zoomedEvent(chart, { xaxis, yaxis }) {
let start = Math.round(xaxis.min / 1000),
end = Math.round(xaxis.max / 1000);
let chartData = await ChartLatency({{$s.Id}}, start, end);
if (!chartData) {
chartData = await ChartLatency({{$s.Id}}, start, end, "minute");
}
if(!chartData || !chartData.length) {
return false
}
chart.updateSeries([{ data: chartData }]);
}
async function RenderHeatmap() { async function RenderHeatmap() {
let heatChart = new ApexCharts( let heatChart = new ApexCharts(
@ -335,8 +350,12 @@ async function RenderHeatmap() {
} }
async function RenderChartLatency() { async function RenderChartLatency() {
options.fill.colors = {{if $s.Online}}["#48d338"]{{else}}["#dd3545"]{{end}}; options.chart.events = {
options.stroke.colors = {{if $s.Online}}["#3aa82d"]{{else}}["#c23342"]{{end}}; zoomed: zoomedEvent,
}
options.fill.colors = {{if $s.Online}}["#48d338"]{{else}}["#dd3545"]{{end}};
options.stroke.colors = {{if $s.Online}}["#3aa82d"]{{else}}["#c23342"]{{end}};
let chart = new ApexCharts(document.querySelector("#service"), options); let chart = new ApexCharts(document.querySelector("#service"), options);
await RenderChart(chart,{{$s.Id}},{{.StartUnix}},{{.EndUnix}},"hour"); await RenderChart(chart,{{$s.Id}},{{.StartUnix}},{{.EndUnix}},"hour");
} }