You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
.config(['ChartJsProvider', function (ChartJsProvider) {
99
102
// Configure all charts
100
103
ChartJsProvider.setOptions({
101
-
colours: ['#FF5252', '#FF8A80'],
104
+
chartColors: ['#FF5252', '#FF8A80'],
102
105
responsive:false
103
106
});
104
107
// Configure all line charts
105
-
ChartJsProvider.setOptions('Line', {
106
-
datasetFill:false
108
+
ChartJsProvider.setOptions('line', {
109
+
showLines:false
107
110
});
108
111
}])
109
112
.controller("LineCtrl", ['$scope', '$timeout', function ($scope, $timeout) {
@@ -135,39 +138,44 @@ See [a simple AMD example](examples/amd.js)
135
138
## CommonJS e.g. webpack
136
139
137
140
Module should work with CommonJS out of the box e.g. [browserify](http://browserify.org/) or
138
-
[webpack](http://webpack.github.io/), see a [webpack example](examples/webpack.config.js).
141
+
[webpack](http://webpack.github.io/), see a [webpack example](examples/webpack.commonjs.js).
139
142
140
143
# Reactive
141
144
142
-
angular-chart.js watch updates on data, series, labels, colours and options and will update, or destroy and recreate,
145
+
angular-chart.js watch updates on data, series, labels, colors and options and will update, or destroy and recreate,
143
146
the chart on changes.
144
147
145
148
# Events
146
149
150
+
angular-chart.js listens to the following events on the `scope` and acts accordingly:
151
+
152
+
*`$destroy`: call `.destroy()` on the chart
153
+
*`$resize`: call `.resize()` on the chart
154
+
147
155
angular-chart.js emits the following events on the `scope` and pass the chart as argument:
148
156
149
-
*`create`: when chart is created
150
-
*`update`: when chart is updated
151
-
*`destroy`: when chart is destroyed
157
+
*`chart-create`: when chart is created
158
+
*`chart-update`: when chart is updated
159
+
*`chart-destroy`: when chart is destroyed
152
160
153
161
```
154
-
$scope.$on('create', function (event, chart) {
162
+
$scope.$on('chart-create', function (evt, chart) {
155
163
console.log(chart);
156
164
});
157
165
```
158
166
159
167
**Note**: the event can be emitted multiple times for each chart as the chart can be destroyed and
160
168
created multiple times during angular `watch` lifecycle.
161
169
162
-
angular-chart.js listen to the scope `destroy` event and destroy the chart when it happens.
170
+
angular-chart.js listens to the scope `$destroy` event and destroys the chart when it happens.
163
171
164
-
# Colours
172
+
# Colors
165
173
166
-
There are a set of 7 default colours. Colours can be replaced using the `colours` attribute.
167
-
If there is more data than colours, colours are generated randomly or can be provided
168
-
via a function through the `getColour` attribute.
174
+
There are a set of 7 default colors. Colors can be replaced using the `colors` attribute.
175
+
If there is more data than colors, colors are generated randomly or can be provided
176
+
via a function through the `getColor` attribute.
169
177
170
-
Hex colours are converted to Chart.js colours automatically,
178
+
Hex colors are converted to Chart.js colors automatically,
171
179
including different shades for highlight, fill, stroke, etc.
172
180
173
181
## Browser compatibility
@@ -176,8 +184,10 @@ For IE8 and older browsers, you will need
176
184
to include [excanvas](https://code.google.com/p/explorercanvas/wiki/Instructions).
177
185
You will also need a [shim](https://github.com/es-shims/es5-shim) for ES5 functions.
178
186
179
-
You also need to have ```height``` and ```width``` attributes for the ```<canvas>``` tag of your chart if using IE8 and older browsers. If you *do not* have these attributes, you will need a
180
-
[getComputedStyle shim](https://github.com/Financial-Times/polyfill-service/blob/master/polyfills/getComputedStyle/polyfill.js) and the line ```document.defaultView = window;```, but there still may be errors (due to code in Chart.js).
187
+
You also need to have ```height``` and ```width``` attributes for the ```<canvas>``` tag of your chart
188
+
if using IE8 and older browsers. If you *do not* have these attributes, you will need a
and the line ```document.defaultView = window;```, but there still may be errors (due to code in Chart.js).
181
191
182
192
```html
183
193
<head>
@@ -197,7 +207,14 @@ You also need to have ```height``` and ```width``` attributes for the ```<canva
197
207
198
208
Please check if issue exists first, otherwise open issue in [github](https://github.com/jtblin/angular-chart.js/issues).
199
209
**Ensure you add a link to a plunker, jsbin, or equivalent.**
200
-
Here is a [jsbin template for 0.x](http://jsbin.com/cucoqe/1/edit?html,js,output) and [one for 1.x](http://jsbin.com/rodunob/edit?html,js,output) for convenience.
210
+
211
+
Here is a [jsbin template](http://jsbin.com/rodunob/edit?html,js,output) for convenience.
212
+
213
+
# v0.x - Chart.js v1.x - deprecated
214
+
215
+
This is the deprecated version of angular-chart.js that uses the v1.x version of Chart.js.
216
+
If you want to use this version, please checkout the
0 commit comments