grafanapie-charttimeserieschart

How to create a pie chart that allows time range selection?

I have a JSON file that contains data like below:

[
    {
        "Time": "Jan 1 2023",
        "Equipment": "TV",
        "Usage": 10
    },
    {
        "Time": "Jan 1 2023",
        "Equipment": "Laptop",
        "Usage": 20
    },
    {
        "Time": "Jan 2 2023",
        "Name": "TV",
        "Usage": 30
    }
]

It means: on Jan 1 2023, I used TV for 10$ and Laptop for 10$; on Jan 2 2023, I used TV for 30$.

I already created a pie chart for total usage of 2 days like below enter image description here

Now I want the option for viewers to view data only during a specific time range, e.g. when they select time range Jan 2 2023 - Jan 3 2023, the chart should look like this enter image description here

I want to stick with the JSON file as data source if at all possible (the file is fully customizable). If not, please suggest anything that works.

I'm actually not sure if it's possible to use Grafana to create a time-series pie chart.

Solution

  • Found the solution. In the Filter box under "Computed columns Filter, Group by", I put

    "Time >= ${__from:date:seconds} && Time <= ${__to:date:seconds}"

    In the JSON file, I use epoch format for value of "Time".

    Reference: https://grafana.com/docs/grafana/latest/dashboards/variables/add-template-variables/#__from-and-__to

    enter image description here