Problems with "Apex Charts" in Dashboard

Hello!

I am new in this area. Do you know how to do an Apex Chart, with type “pie chart” or “donut chart” in the dashboard, related with some properties device?:

I am trying to make a pie chart with apexCharts. Example: Basic Pie Chart Example in React.js – ApexCharts.js

In my case, I have tried to show one property of one device which has just two items:

So then, in the widget of the dashboard of Thinger.io I have choosen the option “Apex Charts” with the template “Pie chart”:
image

So in the apex charts, I want to show just the two items of the device:

But it does not work. The result idoes not show the 100% (neither the right colours that I have choosen in the widget):

image

I have tried to put a max angle with “pie”: pie – ApexCharts.js

But it does not work yet:

Do you know how to do a pie chart (or donut chart) with Apex Chart in Thinger.io? I do not know what is my problem

Thank you so much! :slight_smile:

Hi,

I just added two datasources and could build a graph

Without modifying the display options

image

I could not reproduce your issue.

Thank you for your answer @ega ! :slight_smile:

Step by step, for testing it, I have done:

  1. In a virtual device I have created the property “donutChartTest”, with the next JSON:
    {
    “Bombas riego”: “20”,
    “Clima”: “60”,
    “Iluminacion”: “20”
    }

I have created a new dashbard and a new widget:

image

Into the widget I have put “type” Apex Charts:

In the apex charts I have put the datasources (of the previous JSON):



And in “Display options” I have choosen the “donut” template:

But it does not work. The result is the next:

Is it right? Or is there any problem?

Thank you in advance! :slight_smile:

Hi,

Idk if the apex chart accept a string as input, remove the " " to the numeric values, let them just to the keys

"Bombas de riego" : 20,
...

Let us know how it goes.

1 Like

With that change it works!

Thank you so much @ega ! :slight_smile:

1 Like