Any plans for charts or graphs?

Looking for simple bar or line charts. Don’t see any UI components for this?

1 Like

Opened a feature request

Thanks! We’ve actually got low-level support for D3.js and Google Charts (on mobile only for now), I’ll try to set up an example/tutorial soon.

Linking your issue here for reference:
https://tracker.appgyver.com/feature-requests/p/charts-and-graphs

I made a sample page that shows how a Google Charts line chart can be rendered. I didn’t make it public yet, since there’s a few issues I ran into, so the steps are:

  1. Install the D3.js/Google chart component via the share token wyncBA2o1Wg7b0npTu-Fhw (just paste it into the search box in marketplace)
  2. Make sure you’ve got Set page variable installed in your app (i.e. added to canvas at least once and saved)
  3. Install the example page into your appp via J0dVK-nLWYnNp-GyHg-CBw
  4. After installing and saving, refresh your Composer

Working on fixing the few bugs there, but that should give you a head start!

Great to here charts are being worked on. I was able to install the D3.js/Google chart component via the market place. But installing the example page was a problem as I couldn’t find it in the market place.

An example of very simple line chart with a few data point would be very helpful. The example would have a string to go the following properties:

Chart Function
Chart Style
Chart Data

Thanks

Looks like the share token got messed up at some point – J0dVK-nLWYnNp-GyHg-CBw will work (edited in the post above too), and it’s available publicly now too as Google Charts example. Check it out and let me know if you get it working!

Thanks,

It works great and I was able to change it to a bar chart with no problem.

1 Like

Is the chart module working properly? Any hints on what should be parameters for the Chart function? Any advice where to look for this information?

image

It’s a bit low-level at the moment and works by evaluating a Google Chart/D3.js JavaScript function, but if you install the Google charts example page (token J0dVK-nLWYnNp-GyHg-CBw), you can see how things should be wired up.

Cool that helps a lot.

Also what helped is for me to realized that the tokens can be found by searching the components. Screenshot below in case anyone else wondered what to do about them.