mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-02-25 18:45:27 -06:00
Cleanup for new chart library (foot).
This commit is contained in:
James Cole
parent
d1b97da309
commit
14aacf42b9
@ -6,228 +6,9 @@ $(function () {
|
||||
*/
|
||||
$.getJSON('chart/home/account').success(function (data) {
|
||||
var options = {
|
||||
chart: {
|
||||
renderTo: 'chart',
|
||||
type: 'line'
|
||||
},
|
||||
|
||||
series: data.series,
|
||||
title: {
|
||||
text: data.chart_title
|
||||
},
|
||||
yAxis: {
|
||||
formatter: function () {
|
||||
return '$' + Highcharts.numberFormat(this.y, 0);
|
||||
}
|
||||
},
|
||||
subtitle: {
|
||||
text: data.subtitle,
|
||||
useHTML: true
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
floor: 0,
|
||||
type: 'datetime',
|
||||
dateTimeLabelFormats: {
|
||||
day: '%e %b',
|
||||
year: '%b'
|
||||
},
|
||||
title: {
|
||||
text: 'Date'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
shared: true,
|
||||
crosshairs: false,
|
||||
formatter: function () {
|
||||
var str = '<span style="font-size:80%;">' + Highcharts.dateFormat("%A, %e %B", this.x) + '</span><br />';
|
||||
for (x in this.points) {
|
||||
var point = this.points[x];
|
||||
var colour = point.point.pointAttr[''].fill;
|
||||
str += '<span style="color:' + colour + '">' + point.series.name + '</span>: € ' + Highcharts.numberFormat(point.y, 2) + '<br />';
|
||||
}
|
||||
//console.log();
|
||||
return str;
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
line: {
|
||||
shadow: true
|
||||
},
|
||||
series: {
|
||||
cursor: 'pointer',
|
||||
negativeColor: '#FF0000',
|
||||
threshold: 0,
|
||||
lineWidth: 1,
|
||||
marker: {
|
||||
radius: 2
|
||||
},
|
||||
point: {
|
||||
events: {
|
||||
click: function (e) {
|
||||
hs.htmlExpand(null, {
|
||||
src: 'chart/home/info/' + this.series.name + '/' + Highcharts.dateFormat("%d/%m/%Y", this.x),
|
||||
pageOrigin: {
|
||||
x: e.pageX,
|
||||
y: e.pageY
|
||||
},
|
||||
objectType: 'ajax',
|
||||
headingText: '<a href="accounts/show/' + this.series.id + '">' + this.series.name + '</a>',
|
||||
width: 250
|
||||
}
|
||||
)
|
||||
;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
}
|
||||
};
|
||||
$('#chart').highcharts(options);
|
||||
});
|
||||
|
||||
/**
|
||||
* Get chart data for categories chart:
|
||||
*/
|
||||
$.getJSON('chart/home/categories').success(function (data) {
|
||||
$('#categories').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: 'Expenses for each categorie'
|
||||
},
|
||||
subtitle: {
|
||||
text: '<a href="categories/index">View more</a>',
|
||||
useHTML: true
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
labels: {
|
||||
rotation: -45,
|
||||
style: {
|
||||
fontSize: '12px',
|
||||
fontFamily: 'Verdana, sans-serif'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Expense (€)'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: 'Total expense: <strong>€ {point.y:.2f}</strong>',
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
cursor: 'pointer'
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'Population',
|
||||
data: data,
|
||||
|
||||
events: {
|
||||
click: function (e) {
|
||||
alert('klik!');
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* Get chart data for budget charts.
|
||||
*/
|
||||
$.getJSON('chart/home/budgets').success(function (data) {
|
||||
$('#budgets').highcharts({
|
||||
chart: {
|
||||
type: 'bar'
|
||||
},
|
||||
title: {
|
||||
text: 'Budgets and spending'
|
||||
},
|
||||
subtitle: {
|
||||
text: '<a href="#">View more</a>',
|
||||
useHTML: true
|
||||
},
|
||||
xAxis: {
|
||||
categories: data.labels,
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
labels: {
|
||||
style: {
|
||||
fontSize: '11px',
|
||||
fontFamily: 'Verdana, sans-serif'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Amount (€)',
|
||||
align: 'high'
|
||||
},
|
||||
labels: {
|
||||
overflow: 'justify'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return false;
|
||||
return '€ ' + Highcharts.numberFormat(this.y, 2);
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
cursor: 'pointer',
|
||||
events: {
|
||||
click: function(e) {
|
||||
alert('klik!!');
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
formatter: function () {
|
||||
return '€ ' + Highcharts.numberFormat(this.y, 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled:false,
|
||||
layout: 'vertical',
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
x: -40,
|
||||
y: 100,
|
||||
floating: true,
|
||||
borderWidth: 1,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor || '#FFFFFF'),
|
||||
shadow: true
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
series: data.series
|
||||
});
|
||||
$.plot("#flot-chart-accounts", data, options);
|
||||
});
|
||||
|
||||
|
||||
|
||||
8
app/assets/javascripts/flot/jquery.flot.min.js
vendored
Normal file
8
app/assets/javascripts/flot/jquery.flot.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@ -10,7 +10,5 @@
|
||||
//
|
||||
// The available directives right now are require, require_directory, and require_tree
|
||||
//
|
||||
//= require highslide/highslide-full.min
|
||||
//= require highslide/highslide.config
|
||||
//= require_tree highcharts
|
||||
//= require flot/jquery.flot.min
|
||||
//= require firefly/index
|
||||
|
||||
@ -1,8 +1,5 @@
|
||||
@extends('layouts.default')
|
||||
@section('content')
|
||||
@if($count > 0)
|
||||
@include('partials.date_nav')
|
||||
@endif
|
||||
@if($count == 0)
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12">
|
||||
@ -33,8 +30,35 @@
|
||||
|
||||
<!-- ACCOUNTS -->
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12">
|
||||
<div id="chart"></div>
|
||||
<div class="col-lg-8 col-md-12 col-sm-12">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<i class="fa fa-credit-card fa-fw"></i> Your accounts
|
||||
<div class="pull-right">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
|
||||
Actions
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
<ul class="dropdown-menu pull-right" role="menu">
|
||||
<li><a href="#">Action</a>
|
||||
</li>
|
||||
<li><a href="#">Another action</a>
|
||||
</li>
|
||||
<li><a href="#">Something else here</a>
|
||||
</li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#">Separated link</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="flot-chart-accounts" style="height:300px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -51,9 +75,15 @@
|
||||
|
||||
@include('transactions.journals-small',['transactions' => $data[0],'account' => $data[1]])
|
||||
<div class="btn-group btn-group-xs">
|
||||
<a class="btn btn-default" href="{{route('transactions.create','withdrawal')}}?account_id={{$data[1]->id}}"><span class="glyphicon glyphicon-arrow-left" title="Withdrawal"></span> Add withdrawal</a>
|
||||
<a class="btn btn-default" href="{{route('transactions.create','deposit')}}?account_id={{$data[1]->id}}"><span class="glyphicon glyphicon-arrow-right" title="Deposit"></span> Add deposit</a>
|
||||
<a class="btn btn-default" href="{{route('transactions.create','transfer')}}?account_from_id={{$data[1]->id}}"><span class="glyphicon glyphicon-resize-full" title="Transfer"></span> Add transfer</a>
|
||||
<a class="btn btn-default"
|
||||
href="{{route('transactions.create','withdrawal')}}?account_id={{$data[1]->id}}"><span
|
||||
class="glyphicon glyphicon-arrow-left" title="Withdrawal"></span> Add withdrawal</a>
|
||||
<a class="btn btn-default"
|
||||
href="{{route('transactions.create','deposit')}}?account_id={{$data[1]->id}}"><span
|
||||
class="glyphicon glyphicon-arrow-right" title="Deposit"></span> Add deposit</a>
|
||||
<a class="btn btn-default"
|
||||
href="{{route('transactions.create','transfer')}}?account_from_id={{$data[1]->id}}"><span
|
||||
class="glyphicon glyphicon-resize-full" title="Transfer"></span> Add transfer</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user