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.
Welcome to the nuBuilder Forums!
Register and log in to access exclusive forums and content available only to registered users.
Register and log in to access exclusive forums and content available only to registered users.
Apex charts
-
- 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
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/
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
-
- nuBuilder Team
- Posts: 4305
- Joined: Sun Oct 14, 2018 6:43 pm
- Has thanked: 71 times
- Been thanked: 446 times
- Contact:
Re: Apex charts
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.
You could also ask this questions in an Apex forum (if there is any) or at stackoverflow. The question is not specific to nuBuilder.
-
- Posts: 114
- Joined: Sun Sep 29, 2019 12:40 pm
Re: Apex charts
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
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