20 Dec 2023 03:43 PM
Hi!
I am encountering a problem while trying to convert QueryResult to TimeseriesBand for later use in the Timeseries Band Chart. I am providing arguments for conversion util such as records and types:
(record is an array of: {timeseries: "", someValue: 2, someAnotherValue: 4}),
but receiving undefined every time. Is there any special form of data that I should provide as an argument? Is it in general possible to convert any QueryResult and later display it as a Timeseries Band Chart? Maybe this util is for another purpose. Thank you!
Solved! Go to Solution.
20 Dec 2023 06:43 PM
Hi @veranika_k
I am checking internally what the intention of convertToTimeseriesBand is, since we don't have yet documentation available. To me it looks like it should be used convert the output of a davis analyzer to a band chart
Best,
Sini
21 Dec 2023 08:55 AM
Yes, it seems so. Thank you!
21 Dec 2023 08:55 AM
Hi @veranika_k ,
I just came up with a minimal example for you to try:
import { useDqlQuery } from "@dynatrace-sdk/react-hooks";
import { Paragraph, ProgressCircle, TimeseriesChart, convertToTimeseriesBand } from "@dynatrace/strato-components-preview";
import React from "react";
export const TimeseriesBandChart = () => {
const queryResult = useDqlQuery({
body: {
query: `timeseries min = min(dt.host.cpu.usage), max = max(dt.host.cpu.usage)`,
},
});
if (!queryResult.data) {
return <ProgressCircle />;
}
if (queryResult.data.records.length < 1 || queryResult.data.records[0] === null) {
return <Paragraph>No data</Paragraph>;
}
const timeseriesBand = convertToTimeseriesBand(queryResult.data.records[0], queryResult.data.types[0]);
if (!timeseriesBand) {
return <Paragraph>Could not convert response. Ensure to have field names ending with min/lower and max/upper.</Paragraph>;
}
return (
<TimeseriesChart>
<TimeseriesChart.Band data={timeseriesBand.timeseriesBand} />
</TimeseriesChart>
);
};
Let me know if that helps!
21 Dec 2023 09:46 AM
I will try and let you know in a moment 🙂
21 Dec 2023 02:31 PM
Works, thanks a lot!