DEV Community

Discussion on: Use Laravel charts in Laravel.

Collapse
 
cameljohn profile image
CamelJohn

Hi there,

I'm new to laravel/web-development/the whole lot. so my understanding is quite basic (maybe i have a lot of common knowledge).

for some reason My charts are not appearing. and i feel like the joke is on me - like there is some thing that i fail to see - that is quite obvious to the rest of the reader.

i've also downloaded the chart.js library to try and make the chart work.

"Failed to load resource: the server responded with a status of 404 (Not Found)" is the console message i get.

i followed the line chart example

help please :)

Collapse
 
arielmejiadev profile image
Ariel Mejia

Ofcourse, you have a repo of the proyect? if you like I could make a repo with the example just to show some example or if you have one, maybe you can share the link and I will try, just a question, do you see a circle loader?

I will be waiting to help

Collapse
 
cameljohn profile image
CamelJohn

Hi Ariel,

Yes, I see a circle loader. but for some reason I think there is a component/vaiable/library-link missing.

I do not have a repository of the project - it is simply a new project in wich i followed your post's instructions to see if i could make a chart using ChartJS.

so far i've seen people use a html tag and some JS code to render charts.

i came upon your post when i wanted to use laravel queries/route-model-binding to retun some data to the chart.

I't would be most helpful is you could send me an example so i can try and understand what is wrong.

thank you so much.

Thread Thread
 
arielmejiadev profile image
Ariel Mejia

Ok I will send you a the original code maybe in an hour or more, but at this moment I think you should review in header of your template, you need to have :

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.min.js" charset="utf-8">
</script>

If you already have it, remember to end your template with:

...
{!! $yourVar->script() !!}
</html>

I will send you an example, thanks for follow the post.

Thread Thread
 
cameljohn profile image
CamelJohn • Edited

so,

i've played around with the code and the chart is rendered.

now i'm trying to pass data from my project's controller via two query's
one for the labels and one for the data - those two results i have stored in two variables in the controller. i then attempted to insert those variables into the relevant field functions: labels, dataset..
but what i get is an empty table with "object Object" in the x axis and 0 - 1.0 in the y axis but no line is rendered.

i've tried to die-dump the variables. then i figured out i can parse them "toArray()" but still i got the same result.

any idea's what i should do ?

Thread Thread
 
arielmejiadev profile image
Ariel Mejia

The code is already added in the post, ok Maybe because the "toArray()" function returns a wrapper that certanly is similar to array you can access to data like an array, but It is not a pure php array because you can use some methods with the result array, maybe try adding mock data "[10,40,20]" and pass it at "dataset()" method.

Thread Thread
 
cameljohn profile image
CamelJohn

so...the mock data works just fine.
but i want to pass data from something like this:

$label = DB::table('users')->where('name', 'like', '%john%')->get('name');

and then pass the variable $label to the chart like so:

$usersChart->labels($label);

the same for the dataset:

$data = DB::table('users')->where('name', 'like', '%john%')->get('age');

$usersChart->dataset('all users named like john of age 44 and up', 'line', $data)
->color("rgb(255, 99, 132)")
->backgroundcolor("rgb(255, 99, 132)")
->fill(true)
->linetension(0.3);

    return view('users', [ 'usersChart' => $usersChart ] );

but when i dye dump it says they are collections holding arrays. and the chart does not work :/

Thread Thread
 
arielmejiadev profile image
Ariel Mejia

I recommend you to make first a dd() of $label, maybe it returns an array of Users model collection and you need to pass a simple array not a multidimensional one, so maybe you need something like:

$label = DB::table('users')->where('name', 'like', '%john%')->get('name').toArray();
$data = DB::table('users')->where('name', 'like', '%john%')->get('age').toArray();

you need to see something like:

[
  'John Doe',
  'John Johnson',
  'John Davids'
]

I mean maybe you try this but just to be sure if these not work, you can create a array from a loop, it is not elegant way but only to be sure:

$johns = Users::where('name', '=', 'John')->get('name');
//or
//$johns = Users::where('name', '=', 'John')->pluck('name');
//or
//$johns = Users::where('name', '=', 'John')->get()->name->toArray();
$johnnys = [];
foreach($johns as $john){
  $johnnys[] = $john->name;
}
dd($johnnys);

Later you can use a tap() method to make it more elegant

Thread Thread
 
cameljohn profile image
CamelJohn • Edited

Hi ariel,

Sorry im new to this community and am trying to see how i can send code snippets like tou do.

Ive dye dumped the label and dataset collections (the come from querries) and i recieve a collection of php arrays. The problem is that they are key value paired so im guessing the blade does get an object and not an array of data.

Ive looked around for different methids and it seems there might be a get_data() function that takes the params and returns an array.

If it works ill let you know.

If you have some insights for me i'll be more than happy.

Other than that thank you so much !

Thread Thread
 
arielmejiadev profile image
Ariel Mejia

Thanks I try to explain it as much as I can, you write markdown in dev.to, so to write code snippets you only need to add alt+96 it writes " ` " you need to write this aphostrophe three times to open a block and three times to close the block, inside the block just paste your code, I think that you can use other ways to get data as you want but is a eloquent stuff, if you wish you can paste the dd() output and maybe I could help.

Happy code!