Skip to content

Commit

Permalink
adding Funnel and Radar chart support, $scope.options now takes a pro…
Browse files Browse the repository at this point in the history
…mise, and added support for export config
  • Loading branch information
Grant Stevens committed Oct 4, 2015
1 parent 073084a commit ff6b4fa
Show file tree
Hide file tree
Showing 2 changed files with 247 additions and 164 deletions.
73 changes: 72 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ angular.module('MyModule', ['amChartsDirective'])
```


#### [You can play with a working JS Fiddle example here!](http://jsfiddle.net/w3vpc35o/41/)
#### [JSFiddle Example here](http://jsfiddle.net/w3vpc35o/41/)


#### Quick sample code
Expand Down Expand Up @@ -84,6 +84,77 @@ $scope.amChartOptions = {
}]
}
```

#### Promise based chart rendering

``` javascript

// this function returns our chart data as a promise
$scope.dataFromPromise = function(){
var deferred = $q.defer();

var data = [{
year: 2005,
income: 23.5,
expenses: 18.1
}, {
year: 2006,
income: 26.2,
expenses: 22.8
}, {
year: 2007,
income: 30.1,
expenses: 23.9
}, {
year: 2008,
income: 29.5,
expenses: 25.1
}, {
year: 2009,
income: 24.6,
expenses: 25
}];

deferred.resolve(data)
return deferred.promise;
};

// We can optionally pass a promise to the options attribute on the AmChartsDirective
// to delay the chart rendering until the promise resolves
$scope.amChartOptions = $timeout(function(){
return {
// we can also use a promise for the data property to delay the rendering of
// the chart till we actually have data
data: $scope.dataFromPromise(),
type: "serial",
theme: 'black',
categoryField: "year",
rotate: true,
pathToImages: 'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/images/',
legend: {
enabled: true
},
chartScrollbar: {
enabled: true,
},
categoryAxis: {
gridPosition: "start",
parseDates: false
},
valueAxes: [{
position: "top",
title: "Million USD"
}],
graphs: [{
type: "column",
title: "Income",
valueField: "income",
fillAlphas: 1,
}]
}
}, 1000)

```


##### If you do not specify a category field or a value field, the directive will assume the category field is at index [0] and the value field is at index [1]. Using the example above, 'year' would be the category field, and 'income' would be the value field.
Expand Down
Loading

0 comments on commit ff6b4fa

Please sign in to comment.