Follow this guide to integrate bar chart reports into your Laravel application. Reports like the following come with this guide:
- Total number of Orders by day
- Total number of Users subscribed by day
- etc
The library used for the charts is: http://www.oesmith.co.uk/morris.js/
First put this into your page that will have the reports (in the Blade view) to include Morris library:
<link rel="stylesheet" href="http://cdn.oesmith.co.uk/morris-0.4.3.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="http://cdn.oesmith.co.uk/morris-0.4.3.min.js"></script>
Then an example of the route/controller that will generate the report and display it to the user:
$days = Input::get('days', 7);
$range = \Carbon\Carbon::now()->subDays($days);
$stats = User::where('created_at', '>=', $range)
->groupBy('date')
->orderBy('date', 'DESC')
->remember(1440)
->get([
DB::raw('Date(created_at) as date'),
DB::raw('COUNT(*) as value')
])
->toJSON();
$this->layout->content = View::make('admin.stats.list', compact('stats'));
Now display this bar chart in your view:
<script>
var data = JSON.parse('{{ $stats }}');
new Morris.Bar({
// ID of the element in which to draw the chart.
element: 'stats-container',
data: data,
xkey: 'date',
ykeys: ['value'],
labels: ['Users']
});
</script>
<ul class="nav nav-pills">
<li class="{{ Input::get('days') == 7 || Input::get('days') == '' ? 'active' : ''}}"><a href="{{ url('stats?days=7') }}">7 Days</a></li>
<li class="{{ Input::get('days') == 30 ? 'active' : ''}}"><a href="{{ url('stats?days=30') }}">30 Days</a></li>
<li class="{{ Input::get('days') == 60 ? 'active' : ''}}"><a href="{{ url('stats?days=60') }}">60 Days</a></li>
<li class="{{ Input::get('days') == 90 ? 'active' : ''}}"><a href="{{ url('stats?days=90') }}">90 Days</a></li>
</ul>
<div id="stats-container" style="height: 250px;"></div>
That's it! You now should have a nice bar chart of all users that registered in the past X number of days. It is trivial to change this to the number of orders. Just replace 'User' with another model such as "Order".
Enjoy!
EDIT: if you need this functionality with AJAX instead of page refresh, I got you covered: https://gist.github.com/msurguy/9984618
Following the above instruction gives me error Unexpected token & what's wrong in it while should work,i am unable to debug.