Welcome to the nuBuilder Forums!

Register and log in to access exclusive forums and content available only to registered users.

Apex charts

Questions related to using nuBuilder Forte.
Post Reply
GlenMcCabe
Posts: 114
Joined: Sun Sep 29, 2019 12:40 pm

Apex charts

Unread post by GlenMcCabe »

I have several simple Apex charts based around referrals to an organisation.

eg

referrals by coordinator responsible for referral
referrals by reason for referral
referrals by location

I am now trying to chart more complex charts.

eg referrals by coordinator and reason. I can select the information and produce an array of the format
user reason referrals
user1, reason1, 7
user1, reason3, 24
user4, reason2, 8
user5, reason2, 14
user5, reason4, 6

user and reason are text referrals is numeric.
The array is working as I can plot simple graphs from it.
I would like to plot a chart with user on the xaxis and bars representing the reasons with a legend for the reasons.

the number of users reasons and referrals will depend on the dates chosen.

Below is my latest attempt

<div id="chart">
<div id="apex-chart"></div>
</div>

<script>

$sd="#start_date#";
$ed="#end_date#";

$uks=$sd.slice(8, 10) + "-" +$sd.slice(5, 7) + "-" + $sd.slice(0, 4)
$uke=$ed.slice(8, 10) + "-" +$ed.slice(5, 7) + "-" + $ed.slice(0, 4)

$(function() {

var col0 = gdata.map(d => d[0]).slice(1);
var col1 = gdata.map(d => d[1]).slice(1);
var col2 = gdata.map(d => d[2]).slice(1);

var options = {
chart: {
background: '#fff',
width: "100%",
height: 400,
type: graph_type,
stacked: true,

},


dataLabels: { enabled: true, },

series: [ { x: col1,
y: col2 },

],

xaxis: { categories: col0},


title: {
text: 'Referrals by Coordinator ' + $uks + ' to ' + $uke,
},

};

var chart = new ApexCharts(document.querySelector("#apex-chart"), options);
chart.render();

});

</script>

I have tried several variants and feel the problem lies with the series.

Any suggestions would be very helpful.
Janusz
nuBuilder Team
Posts: 506
Joined: Fri Dec 28, 2018 1:41 pm
Location: Krakow, Poland
Has thanked: 8 times
Been thanked: 18 times

Re: Apex charts

Unread post by Janusz »

Hi,
For Apexcharts there are some limitation in the free library. What I would suggest first is to look on the available charts library if any on the chart is OK for your application and then there is as well the sample code attached. Belowe just any example from the apexcharts demo :
https://apexcharts.com/javascript-chart ... rts/basic/
As far as I know but was not using it -there are as well more advanced charts available in the Fusion charts but they are not free and not a part of standard nuBuilder distribution. But of course you can add any charts library to your version of nuBuilder.
There are as well other libraries which you can potentially use for example:
https://gionkunz.github.io/chartist-js/index.html
https://www.rgraph.net/
If you like nuBuilder, please leave a review on SourceForge
kev1n
nuBuilder Team
Posts: 4305
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 446 times
Contact:

Re: Apex charts

Unread post by kev1n »

Hi,

You could also ask this questions in an Apex forum (if there is any) or at stackoverflow. The question is not specific to nuBuilder.
GlenMcCabe
Posts: 114
Joined: Sun Sep 29, 2019 12:40 pm

Re: Apex charts

Unread post by GlenMcCabe »

Kevin

Thanks for your reply. I think my problem lies with the actual series definitions. Using the array columns as series for charts works fine for 2 tier charts such as referrals by location. They do not work for 3 tier charts such as referrals by reason within location. I will try to manipulate the arrays to reformat the series.

I have seen looking on line and will try stack overflow.

Glen
Post Reply