Custom App Module - AG Chart Generator

Releasing a new custom app module that provides advanced chart configs and options

It Accepts Data sources in 2 formats:

  1. As a array with key values one for the terms, the other for the count
[ { "category": "BALLONS", "count": "533" }... ]

In the above case, we can enable the XY Axis toggle provided in the Wappler module so that it can generate a series for the same based on the values. This is essentially helpful for queries such as Top 10, top 50, etc.

  1. For the 2nd type of Data, given in the format as below
[ { "month": "2026-12", "checked": "1", "flagged": "1" }, { "month": "2025-01", "checked": "1", "flagged": "1" }... ]

We can feed this directly to the module data source.

5 Likes

Some screenshots of visual representation of module would be very helpful.

Hi @Notum,
Sure.




3 Likes

How do I replicate your last chart Regular Internet Users?

For example: I have users and each users makes calls, I want a chart to user each users (color coded) and how many calls was made for each hours.

User 1 10am 5 calls
User 2 10am 6 calls
User 1 11am 2 calls
User 2 11am 6 calls

etc.

Hi @KrishManohar,
To do the above
You need to have your data supplied in below fomrat:

[
  {
    "year": "2012",
    "16-24": 7088,
    "25-34": 8162,
    "35-44": 7986,
    "45-54": 7694,
    "55-64": 5624,
    "65-74": 3153,
    "75+": 1057
  },
  {
    "year": "2013",
    "16-24": 7075,
    "25-34": 8457,
    "35-44": 7952,
    "45-54": 8005,
    "55-64": 5821,
    "65-74": 3562,
    "75+": 1371
  },...
]

Then untick Stacked.
Set Chart Type to “Column”

Also please use the latest version of the module.

1 Like

Added Support for Percentage Charts:

@cdmx/wappler_ac_ag_chart

Given Data in the below format it can now generates a Percentage Charts:

[
  {
    "name": "Covered",
    "count": 17000
  },
  {
    "name": "Not Covered",
    "count": 3000
  }
]

Instructions provided in Readme

Released AC2 support.

3 Likes