DEV Community

Create charts in Laravel with eloquent and Larapex Charts

Ariel Mejia on January 16, 2020

What is Larapex? It is a Laravel package that provides a wrapper to create apexcharts with only PHP. What we are going to bu...
Collapse
 
lancelotcs profile image
lance du Toit

Hi @arielmejiadev, Thanks for the package, I'm pretty new with Laravel, but managed to get your charts working well with my MSSQL database, the issue I'm trying to overcome or understand is how can we put multiple charts on one view. I have tried to create components and bring them to my main dashboard, but It seems I can only have one at a time displaying, what am I missing here?
PS-I hope you enjoyed the coffee on me.

Collapse
 
arielmejiadev profile image
Ariel Mejia

Hi @lancelotcs hehe thanks! the package allows to use CLI to generate chart classes so you would be able to add multiple charts through the view/js component, you can add an issue in the github repository with your current code so I am going to be able to reproduce it.

Collapse
 
lancelotcs profile image
lance du Toit

Hi, thanks for the quick response, I managed to get it to work, I changed my controller to inject (not sure if correct word) both charts into one function, then sent both charts to the view in the array. My issue was I had 2 functions in 1 controller and 2 routes to same location and controller calling 2 different functions, only one of these would work at any given time.

Is there a list of the return functions in the chart like setTitle(),setSubtitle(),setColors(),setLabels(),etc?

Image description
Image description

Collapse
 
haiderlatitude profile image
Haider Ali • Edited

Hi @arielmejiadev. Firstly, thanks for a great package for creating charts. I've used your package in my laravel project and it worked like a breeze, however, I think I have found a bug. Let me demonstrate;

So the thing is, I first created a pie chart exactly like you mentioned and it worked perfectly. However, I then changed the type of the chart from "pie" to "line", but when I changed the type, the method "setLabels()" stopped working. Instead of setting our custom labels for the chart it just states "series-1" and "series-2".

Then I again changed the type from "line" to "bar" and tried setting the labels on that type of chart, but only to find out it again sets the labels on that chart "series-1" and "series-2".

Then I tried to completely remove the labels but again, in vain. The labels don't get removed either, but stay there having the values "series-1" and "series-2".

Please fix this bug.

Thank you.

Collapse
 
arielmejiadev profile image
Ariel Mejia

Hi Haider thanks for using the package... I am currently working on my free time on updating the docs site... I will try to check... if you could add an issue in the package repository would be great.

Are you using the blade integration? or the Vue/Inertia integration?

I would be glad to check this as soon as possible, just take in mind that it is something that I usually check on weekends.

Collapse
 
junedchhipa profile image
Juned Chhipa

Great work there.

Would you mind if I add the link of Larapex in the main ApexCharts.js repository? I would also like to add an intro page of Larapex to the docs section of the website (similar to apexcharts.com/docs/react-charts/) so that people willing to use ApexCharts with Laravel finds it easily.

Cheers

Collapse
 
arielmejiadev profile image
Ariel Mejia

Let me know if you need something more, thanks for taking the time to check it

Collapse
 
arielmejiadev profile image
Ariel Mejia

Of course it would be awesome it would be very nice

Collapse
 
arielmejiadev profile image
Ariel Mejia

Hi Juned just to tell you that the apexcharts.com site is broken, greetings!

Collapse
 
alexv96 profile image
alexv96

Hi question how can I format it as a thousands separator ? for example I have tried all the php number_format money_format options and I have this number 41598625 and in the graph it only shows me 4.159 or sometimes it doesn't make up a number nothing to do.

I made the query from the DB already brought with the number format that I want but when I pass it to the graph the format disappears.

Collapse
 
masterinho52 profile image
Julio

Hi Ariel,

Great job, greetings from Xela, this package looks very easy to use, i will give it a try and let you know how it goes!

Just for records, the documentation site is broken : arielmejiadev.github.io/LarapexCha...

Best!

Collapse
 
arielmejiadev profile image
Ariel Mejia

Hi yep I was updated the new version of the package and the documentation just today I release the 1.0.5 version, if you give a try now it will load, thanks You are from Guatemala right? please share with other cool Laravel artisans I am from Guatemala too there are Laravel devs?

Collapse
 
jhondona profile image
jhondona

Good day sir. I was trying to view the documentation but since it is broken at the moment, I will just ask here if it is possible or is there a parameter I can use to add a link on the chart ? thank you. Btw, I really like this package. Great work.

Collapse
 
arielmejiadev profile image
Ariel Mejia

Sorry, a few day ago I release the version 2 of the package and I updated the documentation site the link is now updated, hope you enjoy it!

Collapse
 
jolexc profile image
jolexC

Hi Ariel,

Thank you for this Larapex... Really appreciate it.
I would like to try the heatmap. Do you have an example for this type of Chart where I can explore in?

Thanks

Collapse
 
arielmejiadev profile image
Ariel Mejia

Here an online example using Larapex & Tailwindcss larapex-chart-example.herokuapp.com/ and for a specific heatmap: here is the package docs with an example of heatmap and other chart types with blade or VueJS components with inertia: larapex-charts.netlify.app/more-ch...

Collapse
 
jolexc profile image
jolexC

Thanks for the quick reply.

I am sorry for the confusion. I mean, do have sample of chart heatmap overlay a map. Like map of US with number of voters per State, Color coded, with % and figures showing when the mouse is scroll per state. Thanks

Thread Thread
 
arielmejiadev profile image
Ariel Mejia

Sorry I did not do that before, the package works behind the scenes with apexcharts.js, so you would need to check if there is an example with that but as far as I can remember I never saw something like this, sorry.

Collapse
 
Sloan, the sloth mascot
Comment deleted
Collapse
 
kevind170 profile image
kevind170

Hi Ariel
Brilliant work!
Quick question, is it possible to produce Mixed Charts?
If so, could you point me in the right direction
Many thanks

Collapse
 
arielmejiadev profile image
Ariel Mejia

Sorry at this moment the package only support non mixed charts, because I handle a standard object on the backend and I the mixed charts would have a lot of different structures, it could be something to work on the future, but at this moment the package only has this types:

  • Pie
  • Donut
  • Radial
  • Polar area
  • Line
  • Area
  • Bar
  • Horizontal Bar
  • Heatmap
  • Radar
Collapse
 
nowodev profile image
Favour • Edited

You're a life saver 💪 💪 💪

Collapse
 
arielmejiadev profile image
Ariel Mejia

Hehe hope it helps!

Collapse
 
zaratedev profile image
Jonathan Zarate

Hi, Ariel.

This is a good work!

I hope to contribute very soon.

Collapse
 
arielmejiadev profile image
Ariel Mejia

Sure why not, Thanks for taking the time to check the package, please if you have a comment feel free to write about it, do you already use it?