Forum Academy Marketplace Showcase Pricing Features

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

@steve18 Conditional colors based on the value of each data point is unfortunately not yet possible in the current version of the plugin, but I will definitely look into if a feature like that would be possible to implement in a future update :slight_smile:


Okay, thanks for that. No worries – I’ll just stick to my other charting solution just for the pie-charts…

1 Like

+1 for per-data point conditions! Colors, operators on the text, pictures! Lots of fun possibilities there :slight_smile:


I am trying to make a bar chart looking like this:

But the closest I managed to get so far is this:

How can I make the bars round and remove the label of one data series?
And also, where can I edit the lable font’s size and colour?

I’d appreciate your help!

Hi @zeta1119

You find the data label font size here:

The other options are at this time not (yet) supported by the plugin. I will look into if I can support those options in a future update for you! :slight_smile:

Update 6.24.0 & 6.24.1

:fire: Added the ‘Simple List Calculation’ element! You can now perform up to 5 consecutive calculations (Multiplication, Division, Addition and Subtraction) on a list using a fixed number or the content of another list! This element also supports interval (bucket) grouping of the modified list. The element exposes the results as states to use inside the charts.

:arrow_right: You can see an example here: Chartpreview | Bubble Editor

Thank you for sponsoring @neilpierce !

Don’t forget to refresh your editor after upgrading

1 Like

Absolutely. Thanks for providing the best support ever on plugins. Apex Charts just got better.

1 Like

Update 6.25.0

Added the pyramid chart! The demo page is updated to see it in action:

Don’t forget to refresh your editor after upgrading

1 Like

Hey @Thimo ,

Thanks again for the help. Now I have another issue. Actually it is also on your bubble app / screenshot:

On the left side there is one data point (01/01/2021) which is not connected to the rest of the line. How can I ensure that the line is always connected (without going down to 0) when there are dates without data between data points?

Hi @Pat

When you have empty values, the charts will not plot data points for these values (like you can also see in the second gab of the example). You could check the box to replace these values by zero inside the plugin l, but you mentioned that that is not the behavior you want in your app. At this time the plugin doesn’t have the feature to automatically calculate the mean between the missing data points and connect them. I did see that there is a feature request for the feature that looks like it is almost ready. So when this gets added to a new release I will definitely implement this option for you as I can see that it would be useful! :slight_smile:

Thanks Thimo. Just to clarify or really drive the paint home. This is important whenever somebody wants to show how one value changed over time.

Let’s say I want to present how much money I have on my account:
January 1st: 100 USD
January 10th I add 200 USD and now have 300 USD
January 15th I take away 100now I have: 200 USD

Between those dates it is not that I have now 0 USD but the account balance just did not change.
I think we are talking about the same topic but wanted to make sure it is clear what I mean. I am just surprised thatt Apex did not have this so far because this is important for many types of apps like stock trading, account balance etc.

Love the possibilities with the plugin, @Thimo !!
A question for you though, is it possible to either a) show only the legend for a chart, or b) fix the height of the chart object within the element and format the legend to fit within the element size?

I have a series of pie and donut charts, but the issue is the # and length of the labels for each value can vary quite a bit. In some cases, with long labels, the legend will grow and shrink the size of the pie. Since I have two pies next to each other in a repeating group, I’d prefer if the sizes were equal.

I can see a solution where I hide the legend in one chart element and only show it in another, but don’t know if that’s possible. Any thoughts would be great!

Yes @pat we are on the same page here!

Hi @dev13! At this time there is no option to set a predefined width for the legend. I am not sure if this is supported so I will look into that for you. Does changing the legend placement to ‘bottom’ (instead of right or left) for example help?

Unfortunately, no, moving it to the bottom doesn’t solve the issue. On the bottom, if the labels are lengthy and/or there is variance in the number of labels, the height of the visualization is shortened to accommodate the legend.

It’s pretty counterintuitive, but having an option to turn off the visualization (but keep the legend on) is a potential solution. The best I can think of is to dramatically separate the visual from the legend, have the ability to treat them separately, but keeping all the data definition parts with the legend so it can be driven by the same data as the visual. To the guy not doing the dev work, that sounds simpler than dynamically measuring the size of the legend and increasing the overall chart element size :slight_smile:

@Thimo Long time user of this plugin and we are struggling with a similar issue. It would be amazing to actually have the ability to reuse the last data value if a value is missing in contrast to just using a 0, which you currently provide via the checkbox option. Not sure if this is something that is possible.

@rivergalli Just tried something out. This will replace null/undefined values by the previous value (or if there is no previous value by 0). See before (below) and after (top):

Will this be helpful?

1 Like

@Thimo yes, this is exactly what is needed!

Update 6.28.0

Added the feature to replace null/undefined values with the previous value for the Area Chart - Multiple Lines. @rivergalli (maybe this will also be helpful for you @Pat )

Don’t forget to refresh your editor after upgrading


@Thimo, awesome! This is working great thank you.

@Thimo or anyone else. I am having a small annoyance with formatting dates getting cut off regardless of the size. You can see everything is formatted as mmm dd. I have adjusted the x-axis max height but it doesn’t seem to solve this problem. Is this a bug or I might just be missing a setting. If anyone has any thoughts I would be greatly appreciated.