[New plugin] Beautiful Customizable Charts and Graphs (ApexCharts.js)

Hi @annephili75, you can see in this message how to add the gap spacing:

Simply setting a stroke width and enabling the checkbox to make it transparent. (make sure you are on the latest plugin version)

You always need to make sure your data series match up as the plugin can’t so that for you. If you want to sort your data, you will need to make sure all your data expressions are sorted the same way. So apply the same sorting to all your data series.

Ah! I knew that was it but I didn’t see this option appear like on your model. I updated, and it works very well thank you!

I think you didn’t understand my problem. I don’t know how to sort the data. I tried with ‘sorted’ on the categories. The categories are put in order but the data stays in their place: which means that everything is mixed up.

So I would like to know how you did it so that in your examples, the years follow each other with the right data: 1970, 1980, 1990 … Because in my case, there is no natural sorting that is done …

Ah, it seems like you are sorting on a linked data type’s field. Normally to sort all data expressions the same way you need, for example, to use the sorting feature inside the “Do a search for”. That way you can sort every data expression on the same field. However, you can’t sort on linked data types inside the “Do a search for”. Bubble does not support that. So, to make this work you might want to update your data structure to just have a text field instead of pulling this field from a linked data type

Thank you very much for the tip, it works perfectly!

I have 2 last questions (I hope :sweat_smile:):

  • How to make the percentages appear in a ‘donutchart’. I check and uncheck this below but nothing happens?
  • How to make the labels appear on the donut permanently (not just in ‘hover’ mode)?

Thank you !!

As you can see in the documentation, this checkbox alters the data label values (not the tooltip) as the data labels default to showing the percentages:

By enabling data labels:

Perfect ! Sorry, I don’t know why, i didn’t see this above option !

But … an other problem … Suffix appears when percentage is choosen … (I need use “suffix”, because currency is choosen by my user and it’s a data of data base).

Thank you Thimo, easy once you pointed it out.

Can I also ask how do I tap into the Legend click function? This is turning on/off the clicked Job Status in the graph, again I’d like this to be dashboard wide if someone toggles a status within the graph it toggles it within every reporting window in the dashboard.

Currently I have buttons CON, AVL1, AVL2, AVL3 (see below) in the main control panel at the top of the page that turn the same status categories on/off dashboard wide except in the graph, which requires rerunning the search to update the underlying data tables. It would be great to be able to simply have these buttons linked to the graph legend functionality toggling the same status categories when the user click either the control buttons or the graph legend. This would save me the WU required every time I currently update the graph’s underlying data table.

Obviously the graph is excluding that series once it’s clicked in the Legend, how would I connect this function to my buttons & my buttons to this function? Or is there a way I can simply exclude the related series in the JSON array (sorry, I’m not at all familiar with JSON) shown below (which I assume the Legend click function does somehow)?

Your thoughts…

Right now you are seeing a percentage value on the data label. This is the default behavior. To change this you need to check this option like I mentioned before:

Did you already try that?

There are currently no options for workflow event s for the legend. Instead, if you want to create a custom legend, you can hide the legend on the chart and create your own legend with Bubble elements. That way you have all the control. There are workflow actions present to hide/show certain series. That way you can build your own legend. Keep in mind the hide/show series work with the series you have specified in the chart properties.

This could also be possible, however it will be more complex. You can have some conditionals in the JSON to exclude part of it (e.g. using the :formatted as text operator on a yes/no state) causing the series to be excluded from the chart. But as you are not familiar with JSON this can be a challenge.

Thanks Thimo,

Could you possibly point me to an example of this conditional for excluding series within a JSON array? If I can see an example I’ll certainly have a shot at it.

Thank you Thimo, appreciate your guidance…

@alexnferris I created a quick (ugly) demo of a custom legend that dynamically hides/shows content in the JSON array:

Demo: Chartpreview | Bubble Editor

There is probably a cleaner solution but this just something I created in 5 min :slight_smile:

Hi thimo !
Thanks for your response but I think you don’t understand the problem. I want to display percentage ! But when the percentage display there is 2 signs : percentage sign AND the suffix. See below :

Probleme ticket (7)

Ah! That appears to be a bug. Thanks for the additional information. I should have fixed in update (6.142.6) :slight_smile:

Oh, thank you very much Thimo !
I’m so sorry but I think there is an other bug :sweat_smile:

Gantt/Timeline chart : impossible to make the name of the series appear … Yet my field is a text.
It only works when I write the text myself … And besides, on the demo you only used text. I try with différent fields and tables, no result.

Thanks for your help !

Just to check. Can you use the Bubble debugger to inspect if your data expression is not empty? If it is empty is will display that value