jinql
/
blur-admin
mirror of https://github.com/akveo/blur-admin
1
0
Fork 0
Code Issues Releases Wiki Activity

refactor(routing): migrate chart routes to new structure

pull/3/head
Vladimir Lugovsky 2015-12-16 19:19:31 +03:00
parent d21668ce98
commit 8b6c187f32
31 changed files with 709 additions and 625 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/pages/charts/amCharts/amCharts.module.js Normal file
View File

@ -0,0 +1,20 @@
/**
* @author v.lugovsky
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts.amCharts', [])
.config(routeConfig);
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('charts.amCharts', {
url: '/amCharts',
templateUrl: 'app/pages/charts/amCharts/charts.html'
});
}
})();

146
src/app/pages/charts/amCharts/areaChart/AreaChartCtrl.js Normal file
View File

@ -0,0 +1,146 @@
/**
* @author v.lugovsky
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts.amCharts')
.controller('AreaChartCtrl', AreaChartCtrl);
/** @ngInject */
function AreaChartCtrl($scope, layoutColors, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var areaChart = AmCharts.makeChart(id, {
type: 'serial',
theme: 'blur',
dataProvider: [
{
lineColor: layoutColors.danger,
date: '2012-01-01',
duration: 408
},
{
date: '2012-01-02',
duration: 482
},
{
date: '2012-01-03',
duration: 562
},
{
date: '2012-01-04',
duration: 379
},
{
lineColor: layoutColors.success,
date: '2012-01-05',
duration: 501
},
{
date: '2012-01-06',
duration: 443
},
{
date: '2012-01-07',
duration: 405
},
{
date: '2012-01-08',
duration: 309,
lineColor: layoutColors.primary
},
{
date: '2012-01-09',
duration: 287
},
{
date: '2012-01-10',
duration: 485
},
{
date: '2012-01-11',
duration: 890
},
{
date: '2012-01-12',
duration: 810
}
],
balloon: {
cornerRadius: 6,
horizontalPadding: 15,
verticalPadding: 10
},
valueAxes: [
{
duration: 'mm',
durationUnits: {
hh: 'h ',
mm: 'min'
},
axisAlpha: 0
}
],
graphs: [
{
bullet: 'square',
bulletBorderAlpha: 1,
bulletBorderThickness: 1,
fillAlphas: 0.3,
fillColorsField: 'lineColor',
legendValueText: '[[value]]',
lineColorField: 'lineColor',
title: 'duration',
valueField: 'duration'
}
],
chartCursor: {
categoryBalloonDateFormat: 'YYYY MMM DD',
cursorAlpha: 0,
fullWidth: true
},
dataDateFormat: 'YYYY-MM-DD',
categoryField: 'date',
categoryAxis: {
dateFormats: [
{
period: 'DD',
format: 'DD'
},
{
period: 'WW',
format: 'MMM DD'
},
{
period: 'MM',
format: 'MMM'
},
{
period: 'YYYY',
format: 'YYYY'
}
],
parseDates: true,
autoGridCount: false,
axisColor: '#555555',
gridAlpha: 0,
gridCount: 50
},
export: {
enabled: true
},
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, areaChart);
areaChart.addListener('dataUpdated', zoomAreaChart);
function zoomAreaChart() {
areaChart.zoomToDates(new Date(2012, 0, 3), new Date(2012, 0, 11));
}
}
})();

1
src/app/pages/charts/amCharts/areaChart/areaChart.html Normal file
View File

@ -0,0 +1 @@
<div id="areaChart" class="admin-chart" ng-controller="AreaChartCtrl"></div>

88
src/app/pages/charts/amCharts/barChart/BarChartCtrl.js Normal file
View File

@ -0,0 +1,88 @@
/**
* @author v.lugovsky
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts.amCharts')
.controller('BarChartCtrl', BarChartCtrl);
/** @ngInject */
function BarChartCtrl($scope, layoutColors, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var barChart = AmCharts.makeChart(id, {
type: 'serial',
theme: 'blur',
dataProvider: [
{
country: 'USA',
visits: 3025,
color: layoutColors.primary
},
{
country: 'China',
visits: 1882,
color: layoutColors.danger
},
{
country: 'Japan',
visits: 1809,
color: layoutColors.primaryLight
},
{
country: 'Germany',
visits: 1322,
color: layoutColors.success
},
{
country: 'UK',
visits: 1122,
color: layoutColors.warning
},
{
country: 'France',
visits: 1114,
color: layoutColors.default
}
],
valueAxes: [
{
axisAlpha: 0,
position: 'left',
title: 'Visitors from country'
}
],
startDuration: 1,
graphs: [
{
balloonText: '<b>[[category]]: [[value]]</b>',
fillColorsField: 'color',
fillAlphas: 0.9,
lineAlpha: 0.2,
type: 'column',
valueField: 'visits'
}
],
chartCursor: {
categoryBalloonEnabled: false,
cursorAlpha: 0,
zoomable: false
},
categoryField: 'country',
categoryAxis: {
gridPosition: 'start',
labelRotation: 45
},
export: {
enabled: true
},
creditsPosition: 'top-right',
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, barChart);
}
})();

1
src/app/pages/charts/amCharts/barChart/barChart.html Normal file
View File

@ -0,0 +1 @@
<div id="barChart" class="admin-chart" ng-controller="BarChartCtrl"></div>

31
src/app/pages/charts/amCharts/charts.html
View File

@ -1 +1,30 @@
<widgets ng-model="widgetBlocks"></widgets>
<div class="widgets">
<div class="row">
<div class="col-md-6">
<blur-panel title="Bar Chart" class-container="with-scroll">
<div ng-include="'app/pages/charts/amCharts/barChart/barChart.html'"></div>
</blur-panel>
<blur-panel title="Line Chart" class-container="with-scroll">
<div ng-include="'app/pages/charts/amCharts/lineChart/lineChart.html'"></div>
</blur-panel>
</div>
<div class="col-md-6">
<blur-panel title="Area Chart" class-container="with-scroll" >
<div ng-include="'app/pages/charts/amCharts/areaChart/areaChart.html'"></div>
</blur-panel>
<blur-panel title="Funnel Chart" class-container="with-scroll">
<div ng-include="'app/pages/charts/amCharts/funnelChart/funnelChart.html'"></div>
</blur-panel>
</div>
</div>
<div class="row">
<div class="col-md-12">
<blur-panel title="Pie Chart" class-container="with-scroll">
<div ng-include="'app/pages/charts/amCharts/pieChart/pieChart.html'"></div>
</blur-panel>
</div>
</div>
</div>

48
src/app/pages/charts/amCharts/charts.js
View File

@ -1,48 +0,0 @@
'use strict';
angular.module('BlurAdmin.amChartsPage', ['ngRoute'])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/amCharts', {
templateUrl: 'app/pages/charts/amCharts/charts.html',
controller: 'chartsPageCtrl'
});
}])
.controller('chartsPageCtrl', ['$scope', function ($scope) {
$scope.widgetBlocks = [
{
widgets: [
[
{
title: 'Bar Chart',
url: 'app/pages/charts/amCharts/widgets/barChart/barChart.html'
},
{
title: 'Line Chart',
url: 'app/pages/charts/amCharts/widgets/lineChart/lineChart.html'
}
],
[
{
title: 'Area Chart',
url: 'app/pages/charts/amCharts/widgets/areaChart/areaChart.html'
},
{
title: 'Funnel Chart',
url: 'app/pages/charts/amCharts/widgets/funnelChart/funnelChart.html'
}
]
]
},
{
widgets: [
[
{
title: 'Pie Chart',
url: 'app/pages/charts/amCharts/widgets/pieChart/pieChart.html'
}
]
]
}
];
}]);

69
src/app/pages/charts/amCharts/funnelChart/FunnelChartCtrl.js Normal file
View File

@ -0,0 +1,69 @@
/**
* @author v.lugovsky
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts.amCharts')
.controller('FunnelChartCtrl', FunnelChartCtrl);
/** @ngInject */
function FunnelChartCtrl($scope, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var funnelChart = AmCharts.makeChart(id, {
type: 'funnel',
theme: 'blur',
dataProvider: [
{
title: 'Website visits',
value: 300
},
{
title: 'Downloads',
value: 123
},
{
title: 'Requested prices',
value: 98
},
{
title: 'Contaced',
value: 72
},
{
title: 'Purchased',
value: 35
},
{
title: 'Asked for support',
value: 25
},
{
title: 'Purchased more',
value: 18
}
],
titleField: 'title',
marginRight: 160,
marginLeft: 15,
labelPosition: 'right',
funnelAlpha: 0.9,
valueField: 'value',
startX: 0,
neckWidth: '0%',
startAlpha: 0,
outlineThickness: 1,
neckHeight: '0%',
balloonText: '[[title]]:<b>[[value]]</b>',
export: {
enabled: true
},
creditsPosition: 'bottom-left',
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchFunnelChanges($scope, funnelChart);
}
})();

1
src/app/pages/charts/amCharts/funnelChart/funnelChart.html Normal file
View File

@ -0,0 +1 @@
<div id="funnelChart" class="admin-chart" ng-controller="FunnelChartCtrl"></div>

155
src/app/pages/charts/amCharts/lineChart/LineChartCtrl.js Normal file
View File

@ -0,0 +1,155 @@
/**
* @author v.lugovsky
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts.amCharts')
.controller('LineChartCtrl', LineChartCtrl);
/** @ngInject */
function LineChartCtrl($scope, layoutColors, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var lineChart = AmCharts.makeChart(id, {
type: 'serial',
theme: 'blur',
marginTop: 0,
marginRight: 15,
dataProvider: [
{
year: '1990',
value: -0.17
},
{
year: '1991',
value: -0.254
},
{
year: '1992',
value: 0.019
},
{
year: '1993',
value: -0.063
},
{
year: '1994',
value: 0.005
},
{
year: '1995',
value: 0.077
},
{
year: '1996',
value: 0.12
},
{
year: '1997',
value: 0.011
},
{
year: '1998',
value: 0.177
},
{
year: '1999',
value: -0.021
},
{
year: '2000',
value: -0.037
},
{
year: '2001',
value: 0.03
},
{
year: '2002',
value: 0.179
},
{
year: '2003',
value: 0.2
},
{
year: '2004',
value: 0.180
},
{
year: '2005',
value: 0.21
}
],
valueAxes: [
{
axisAlpha: 0,
position: 'left'
}
],
graphs: [
{
id: 'g1',
balloonText: '[[value]]',
bullet: 'round',
bulletSize: 8,
lineColor: layoutColors.danger,
lineThickness: 1,
negativeLineColor: layoutColors.primary,
type: 'smoothedLine',
valueField: 'value'
}
],
chartScrollbar: {
graph: 'g1',
gridAlpha: 0,
color: '#888888',
scrollbarHeight: 55,
backgroundAlpha: 0,
selectedBackgroundAlpha: 0.1,
selectedBackgroundColor: '#888888',
graphFillAlpha: 0,
autoGridCount: true,
selectedGraphFillAlpha: 0,
graphLineAlpha: 0.2,
graphLineColor: '#c2c2c2',
selectedGraphLineColor: '#888888',
selectedGraphLineAlpha: 1
},
chartCursor: {
categoryBalloonDateFormat: 'YYYY',
cursorAlpha: 0,
valueLineEnabled: true,
valueLineBalloonEnabled: true,
valueLineAlpha: 0.5,
fullWidth: true
},
dataDateFormat: 'YYYY',
categoryField: 'year',
categoryAxis: {
minPeriod: 'YYYY',
parseDates: true,
minorGridAlpha: 0.1,
minorGridEnabled: true
},
export: {
enabled: true
},
creditsPosition: 'bottom-right',
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, lineChart);
lineChart.addListener('rendered', zoomChart);
if (lineChart.zoomChart) {
lineChart.zoomChart();
}
function zoomChart() {
lineChart.zoomToIndexes(Math.round(chart.dataProvider.length * 0.4), Math.round(chart.dataProvider.length * 0.55));
}
}
})();

1
src/app/pages/charts/amCharts/lineChart/lineChart.html Normal file
View File

@ -0,0 +1 @@
<div id="lineChart" class="admin-chart" ng-controller="LineChartCtrl"></div>

146
src/app/pages/charts/amCharts/pieChart/PieChartCtrl.js Normal file
View File

@ -0,0 +1,146 @@
/**
* @author v.lugovsky
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts.amCharts')
.controller('PieChartCtrl', PieChartCtrl);
/** @ngInject */
function PieChartCtrl($scope, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var pieChart = AmCharts.makeChart(id, {
type: 'pie',
startDuration: 0,
theme: 'blur',
addClassNames: true,
legend: {
position: 'right',
marginRight: 100,
autoMargins: false
},
innerRadius: '40%',
defs: {
filter: [
{
id: 'shadow',
width: '200%',
height: '200%',
feOffset: {
result: 'offOut',
in: 'SourceAlpha',
dx: 0,
dy: 0
},
feGaussianBlur: {
result: 'blurOut',
in: 'offOut',
stdDeviation: 5
},
feBlend: {
in: 'SourceGraphic',
in2: 'blurOut',
mode: 'normal'
}
}
]
},
dataProvider: [
{
country: 'Lithuania',
litres: 501.9
},
{
country: 'Czech Republic',
litres: 301.9
},
{
country: 'Ireland',
litres: 201.1
},
{
country: 'Germany',
litres: 165.8
},
{
country: 'Australia',
litres: 139.9
},
{
country: 'Austria',
litres: 128.3
},
{
country: 'UK',
litres: 99
},
{
country: 'Belgium',
litres: 60
}
],
valueField: 'litres',
titleField: 'country',
export: {
enabled: true
},
creditsPosition: 'bottom-left',
autoMargins: false,
marginTop: 10,
marginBottom: 0,
marginLeft: 0,
marginRight: 0,
pullOutRadius: 0,
pathToImages: 'img/',
responsive: {
enabled: true,
rules: [
// at 900px wide, we hide legend
{
maxWidth: 900,
overrides: {
legend: {
enabled: false
}
}
},
// at 200 px we hide value axis labels altogether
{
maxWidth: 200,
overrides: {
valueAxes: {
labelsEnabled: false
},
marginTop: 30,
marginBottom: 30,
marginLeft: 30,
marginRight: 30
}
}
]
}
});
tplSkinChartWatcherHelper.watchDonutChanges($scope, pieChart);
pieChart.addListener('init', handleInit);
pieChart.addListener('rollOverSlice', function (e) {
handleRollOver(e);
});
function handleInit() {
pieChart.legend.addListener('rollOverItem', handleRollOver);
}
function handleRollOver(e) {
var wedge = e.dataItem.wedge.node;
wedge.parentNode.appendChild(wedge);
}
}
})();

1
src/app/pages/charts/amCharts/pieChart/pieChart.html Normal file
View File

@ -0,0 +1 @@
<div id="pieChart" class="admin-chart" ng-controller="PieChartCtrl"></div>

1
src/app/pages/charts/amCharts/widgets/areaChart/areaChart.html
View File

@ -1 +0,0 @@
<div id="areaChart" class="admin-chart" ng-controller="areaChartCtrl"></div>

135
src/app/pages/charts/amCharts/widgets/areaChart/areaChart.js
View File

@ -1,135 +0,0 @@
'use strict';
blurAdminApp.controller('areaChartCtrl', ['$scope', '$timeout', '$element', 'tplSkinChartWatcherHelper', function($scope, $timeout, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var areaChart = AmCharts.makeChart(id, {
type: 'serial',
theme: 'blur',
dataProvider: [
{
lineColor: colorDanger,
date: '2012-01-01',
duration: 408
},
{
date: '2012-01-02',
duration: 482
},
{
date: '2012-01-03',
duration: 562
},
{
date: '2012-01-04',
duration: 379
},
{
lineColor: colorSuccess,
date: '2012-01-05',
duration: 501
},
{
date: '2012-01-06',
duration: 443
},
{
date: '2012-01-07',
duration: 405
},
{
date: '2012-01-08',
duration: 309,
lineColor: colorPrimary
},
{
date: '2012-01-09',
duration: 287
},
{
date: '2012-01-10',
duration: 485
},
{
date: '2012-01-11',
duration: 890
},
{
date: '2012-01-12',
duration: 810
}
],
balloon: {
cornerRadius: 6,
horizontalPadding: 15,
verticalPadding: 10
},
valueAxes: [
{
duration: 'mm',
durationUnits: {
hh: 'h ',
mm: 'min'
},
axisAlpha: 0
}
],
graphs: [
{
bullet: 'square',
bulletBorderAlpha: 1,
bulletBorderThickness: 1,
fillAlphas: 0.3,
fillColorsField: 'lineColor',
legendValueText: '[[value]]',
lineColorField: 'lineColor',
title: 'duration',
valueField: 'duration'
}
],
chartCursor: {
categoryBalloonDateFormat: 'YYYY MMM DD',
cursorAlpha: 0,
fullWidth: true
},
dataDateFormat: 'YYYY-MM-DD',
categoryField: 'date',
categoryAxis: {
dateFormats: [
{
period: 'DD',
format: 'DD'
},
{
period: 'WW',
format: 'MMM DD'
},
{
period: 'MM',
format: 'MMM'
},
{
period: 'YYYY',
format: 'YYYY'
}
],
parseDates: true,
autoGridCount: false,
axisColor: '#555555',
gridAlpha: 0,
gridCount: 50
},
export: {
enabled: true
},
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, areaChart);
areaChart.addListener('dataUpdated', zoomAreaChart);
function zoomAreaChart() {
areaChart.zoomToDates(new Date(2012, 0, 3), new Date(2012, 0, 11));
}
}]);

1
src/app/pages/charts/amCharts/widgets/barChart/barChart.html
View File

@ -1 +0,0 @@
<div id="barChart" class="admin-chart" ng-controller="barChartCtrl"></div>

77
src/app/pages/charts/amCharts/widgets/barChart/barChart.js
View File

@ -1,77 +0,0 @@
'use strict';
blurAdminApp.controller('barChartCtrl', ['$scope', '$timeout', '$element', 'tplSkinChartWatcherHelper', function($scope, $timeout, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var barChart = AmCharts.makeChart(id, {
type: 'serial',
theme: 'blur',
dataProvider: [
{
country: 'USA',
visits: 3025,
color: colorPrimary
},
{
country: 'China',
visits: 1882,
color: colorDanger
},
{
country: 'Japan',
visits: 1809,
color: colorPrimaryLight
},
{
country: 'Germany',
visits: 1322,
color: colorSuccess
},
{
country: 'UK',
visits: 1122,
color: colorWarning
},
{
country: 'France',
visits: 1114,
color: colorDefault
}
],
valueAxes: [
{
axisAlpha: 0,
position: 'left',
title: 'Visitors from country'
}
],
startDuration: 1,
graphs: [
{
balloonText: '<b>[[category]]: [[value]]</b>',
fillColorsField: 'color',
fillAlphas: 0.9,
lineAlpha: 0.2,
type: 'column',
valueField: 'visits'
}
],
chartCursor: {
categoryBalloonEnabled: false,
cursorAlpha: 0,
zoomable: false
},
categoryField: 'country',
categoryAxis: {
gridPosition: 'start',
labelRotation: 45
},
export: {
enabled: true
},
creditsPosition: 'top-right',
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, barChart);
}]);

1
src/app/pages/charts/amCharts/widgets/funnelChart/funnelChart.html
View File

@ -1 +0,0 @@
<div id="funnelChart" class="admin-chart" ng-controller="funnelChartCtrl"></div>

58
src/app/pages/charts/amCharts/widgets/funnelChart/funnelChart.js
View File

@ -1,58 +0,0 @@
'use strict';
blurAdminApp.controller('funnelChartCtrl', ['$scope', '$timeout', '$element', 'tplSkinChartWatcherHelper', function($scope, $timeout, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var funnelChart = AmCharts.makeChart(id, {
type: 'funnel',
theme: 'blur',
dataProvider: [
{
title: 'Website visits',
value: 300
},
{
title: 'Downloads',
value: 123
},
{
title: 'Requested prices',
value: 98
},
{
title: 'Contaced',
value: 72
},
{
title: 'Purchased',
value: 35
},
{
title: 'Asked for support',
value: 25
},
{
title: 'Purchased more',
value: 18
}
],
titleField: 'title',
marginRight: 160,
marginLeft: 15,
labelPosition: 'right',
funnelAlpha: 0.9,
valueField: 'value',
startX: 0,
neckWidth: '0%',
startAlpha: 0,
outlineThickness: 1,
neckHeight: '0%',
balloonText: '[[title]]:<b>[[value]]</b>',
export: {
enabled: true
},
creditsPosition: 'bottom-left',
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchFunnelChanges($scope, funnelChart);
}]);

1
src/app/pages/charts/amCharts/widgets/lineChart/lineChart.html
View File

@ -1 +0,0 @@
<div id="lineChart" class="admin-chart" ng-controller="lineChartCtrl"></div>

144
src/app/pages/charts/amCharts/widgets/lineChart/lineChart.js
View File

@ -1,144 +0,0 @@
'use strict';
blurAdminApp.controller('lineChartCtrl', ['$scope', '$timeout', '$element', 'tplSkinChartWatcherHelper', function($scope, $timeout, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var lineChart = AmCharts.makeChart(id, {
type: 'serial',
theme: 'blur',
marginTop: 0,
marginRight: 15,
dataProvider: [
{
year: '1990',
value: -0.17
},
{
year: '1991',
value: -0.254
},
{
year: '1992',
value: 0.019
},
{
year: '1993',
value: -0.063
},
{
year: '1994',
value: 0.005
},
{
year: '1995',
value: 0.077
},
{
year: '1996',
value: 0.12
},
{
year: '1997',
value: 0.011
},
{
year: '1998',
value: 0.177
},
{
year: '1999',
value: -0.021
},
{
year: '2000',
value: -0.037
},
{
year: '2001',
value: 0.03
},
{
year: '2002',
value: 0.179
},
{
year: '2003',
value: 0.2
},
{
year: '2004',
value: 0.180
},
{
year: '2005',
value: 0.21
}
],
valueAxes: [
{
axisAlpha: 0,
position: 'left'
}
],
graphs: [
{
id: 'g1',
balloonText: '[[value]]',
bullet: 'round',
bulletSize: 8,
lineColor: colorDanger,
lineThickness: 1,
negativeLineColor: colorPrimary,
type: 'smoothedLine',
valueField: 'value'
}
],
chartScrollbar: {
graph: 'g1',
gridAlpha: 0,
color: '#888888',
scrollbarHeight: 55,
backgroundAlpha: 0,
selectedBackgroundAlpha: 0.1,
selectedBackgroundColor: '#888888',
graphFillAlpha: 0,
autoGridCount: true,
selectedGraphFillAlpha: 0,
graphLineAlpha: 0.2,
graphLineColor: '#c2c2c2',
selectedGraphLineColor: '#888888',
selectedGraphLineAlpha: 1
},
chartCursor: {
categoryBalloonDateFormat: 'YYYY',
cursorAlpha: 0,
valueLineEnabled: true,
valueLineBalloonEnabled: true,
valueLineAlpha: 0.5,
fullWidth: true
},
dataDateFormat: 'YYYY',
categoryField: 'year',
categoryAxis: {
minPeriod: 'YYYY',
parseDates: true,
minorGridAlpha: 0.1,
minorGridEnabled: true
},
export: {
enabled: true
},
creditsPosition: 'bottom-right',
pathToImages: 'img/'
});
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, lineChart);
lineChart.addListener('rendered', zoomChart);
if (lineChart.zoomChart) {
lineChart.zoomChart();
}
function zoomChart() {
lineChart.zoomToIndexes(Math.round(chart.dataProvider.length * 0.4), Math.round(chart.dataProvider.length * 0.55));
}
}]);

1
src/app/pages/charts/amCharts/widgets/pieChart/pieChart.html
View File

@ -1 +0,0 @@
<div id="pieChart" class="admin-chart" ng-controller="pieChartCtrl"></div>

135
src/app/pages/charts/amCharts/widgets/pieChart/pieChart.js
View File

@ -1,135 +0,0 @@
'use strict';
blurAdminApp.controller('pieChartCtrl', ['$scope', '$timeout', '$element', 'tplSkinChartWatcherHelper', function($scope, $timeout, $element, tplSkinChartWatcherHelper) {
var id = $element[0].getAttribute('id');
var pieChart = AmCharts.makeChart(id, {
type: 'pie',
startDuration: 0,
theme: 'blur',
addClassNames: true,
legend: {
position: 'right',
marginRight: 100,
autoMargins: false
},
innerRadius: '40%',
defs: {
filter: [
{
id: 'shadow',
width: '200%',
height: '200%',
feOffset: {
result: 'offOut',
in: 'SourceAlpha',
dx: 0,
dy: 0
},
feGaussianBlur: {
result: 'blurOut',
in: 'offOut',
stdDeviation: 5
},
feBlend: {
in: 'SourceGraphic',
in2: 'blurOut',
mode: 'normal'
}
}
]
},
dataProvider: [
{
country: 'Lithuania',
litres: 501.9
},
{
country: 'Czech Republic',
litres: 301.9
},
{
country: 'Ireland',
litres: 201.1
},
{
country: 'Germany',
litres: 165.8
},
{
country: 'Australia',
litres: 139.9
},
{
country: 'Austria',
litres: 128.3
},
{
country: 'UK',
litres: 99
},
{
country: 'Belgium',
litres: 60
}
],
valueField: 'litres',
titleField: 'country',
export: {
enabled: true
},
creditsPosition: 'bottom-left',
autoMargins: false,
marginTop: 10,
marginBottom: 0,
marginLeft: 0,
marginRight: 0,
pullOutRadius: 0,
pathToImages: 'img/',
responsive: {
enabled: true,
rules: [
// at 900px wide, we hide legend
{
maxWidth: 900,
overrides: {
legend: {
enabled: false
}
}
},
// at 200 px we hide value axis labels altogether
{
maxWidth: 200,
overrides: {
valueAxes: {
labelsEnabled: false
},
marginTop: 30,
marginBottom: 30,
marginLeft: 30,
marginRight: 30
}
}
]
}
});
tplSkinChartWatcherHelper.watchDonutChanges($scope, pieChart);
pieChart.addListener('init', handleInit);
pieChart.addListener('rollOverSlice', function (e) {
handleRollOver(e);
});
function handleInit() {
pieChart.legend.addListener('rollOverItem', handleRollOver);
}
function handleRollOver(e) {
var wedge = e.dataItem.wedge.node;
wedge.parentNode.appendChild(wedge);
}
}]);

20
src/app/pages/charts/chartJs/chartJs.module.js Normal file
View File

@ -0,0 +1,20 @@
/**
* @author a.demeshko
* created on 12/16/15
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts.chartJs', [])
.config(routeConfig);
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('charts.chartJs', {
url: '/chartJs',
templateUrl: 'app/pages/charts/chartJs/chartJs.html'
});
}
})();

2
src/app/pages/charts/chartJs/chartJs1DCtrl.js
View File

@ -5,7 +5,7 @@
(function () {
'use strict';
angular.module('BlurAdmin.chartJsPage')
angular.module('BlurAdmin.pages.charts.chartJs')
.controller('chartJs1DCtrl', chartJs1DCtrl);
/** @ngInject */

2
src/app/pages/charts/chartJs/chartJs2DCtrl.js
View File

@ -5,7 +5,7 @@
(function () {
'use strict';
angular.module('BlurAdmin.chartJsPage')
angular.module('BlurAdmin.pages.charts.chartJs')
.controller('chartJs2DCtrl', chartJs2DCtrl);
/** @ngInject */

17
src/app/pages/charts/chartJs/chartJsPage.module.js
View File

@ -1,17 +0,0 @@
/**
* @author a.demeshko
* created on 12/16/15
*/
(function () {
'use strict';
angular.module('BlurAdmin.chartJsPage', ['ngRoute']).config(chartJsPageConfig);
/** @ngInject */
function chartJsPageConfig($routeProvider) {
$routeProvider.when('/chartJs', {
templateUrl: 'app/pages/charts/chartJs/chartJs.html'
});
}
})();

24
src/app/pages/charts/charts.module.js Normal file
View File

@ -0,0 +1,24 @@
/**
* @author v.lugovsky
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.charts', [
'BlurAdmin.pages.charts.amCharts',
'BlurAdmin.pages.charts.chartJs'
])
.config(routeConfig);
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('charts', {
url: '/charts',
abstract: true,
template: '<div ui-view></div>'
});
}
})();

1
src/app/pages/pages.module.js
View File

@ -10,6 +10,7 @@
'BlurAdmin.pages.alerts',
'BlurAdmin.pages.buttons',
'BlurAdmin.pages.charts',
'BlurAdmin.pages.dashboard',
'BlurAdmin.pages.form',
'BlurAdmin.pages.grid',

2
src/app/theme/components/backTop/lib/jquery.backTop.min.js vendored
View File

@ -1,2 +1,2 @@
/* Minified js for jQuery BackTop */
!function(o){o.fn.backTop=function(e){var n=this,i=o.extend({position:400,speed:500,color:"white"},e),t=i.position,c=i.speed,d=i.color;n.addClass("white"==d?"white":"red"==d?"red":"green"==d?"green":"black"),n.css({right:40,bottom:40,position:"fixed"}),o(document).scroll(function(){var e=o(window).scrollTop();console.log(e),e>=t?n.fadeIn(c):n.fadeOut(c)}),n.click(function(){o("html, body").animate({scrollTop:0},{duration:1200})})}}(jQuery);
!function(o){o.fn.backTop=function(e){var n=this,i=o.extend({position:400,speed:500,color:"white"},e),t=i.position,c=i.speed,d=i.color;n.addClass("white"==d?"white":"red"==d?"red":"green"==d?"green":"black"),n.css({right:40,bottom:40,position:"fixed"}),o(document).scroll(function(){var e=o(window).scrollTop();e>=t?n.fadeIn(c):n.fadeOut(c)}),n.click(function(){o("html, body").animate({scrollTop:0},{duration:1200})})}}(jQuery);

4
src/app/theme/components/sidebar/SidebarCtrl.js
View File

@ -22,11 +22,11 @@
subMenu: [
{
title: 'amCharts',
root: '#/amCharts'
root: '#/charts/amCharts'
},
{
title: 'Chart.js',
root: '#/chartJs'
root: '#/charts/chartJs'
}
]
},