Skip to content

Commit 88462b5

Browse files
jtblinjtblin
committed
Add support for bubble chart
1 parent d546ffd commit 88462b5

17 files changed

+1129
-61
lines changed

‎README.md‎

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -63,11 +63,13 @@ adding the dependencies for Angular and Chart.js first:
6363

6464
# Utilisation
6565

66-
There are 7 types of charts so 7 directives: `chart-line`, `chart-bar`, `chart-horizontal-bar`, `chart-radar`,
67-
`chart-pie`, `chart-polar-area`, `chart-doughnut`.
66+
There are 8 types of charts so 8 directives: `chart-line`, `chart-bar`, `chart-horizontal-bar`, `chart-radar`,
67+
`chart-pie`, `chart-polar-area`, `chart-doughnut`, `chart-bubble`.
68+
69+
Here are the options for all directives:
6870

6971
- `chart-data`: series data
70-
- `chart-labels`: x axis labels (line, bar, radar) or series labels (pie, doughnut, polar area)
72+
- `chart-labels`: x axis labels (line, bar, horizontal bar, radar, bubble) or series labels (pie, doughnut, polar area)
7173
- `chart-options`: chart options (as from [Chart.js documentation](http://www.chartjs.org/docs/))
7274
- `chart-series`: (default: `[]`): series labels (line, bar, radar)
7375
- `chart-colors`: data colors (will use default colors if not specified)
@@ -77,9 +79,12 @@ There are 7 types of charts so 7 directives: `chart-line`, `chart-bar`, `chart-h
7779
- `chart-dataset-override`: override individual datasets to allow per dataset configuration e.g. y-axis, mixed type chart
7880

7981
There is another directive `chart-base` that takes an extra attribute `chart-type` to define the type
80-
dynamically, see [stacked bar example](http://jtblin.github.io/angular-chart.js/examples/stacked-bars.html).
82+
dynamically.
83+
84+
You can create mixed type chart using the `chart-dataset-override`, see
85+
[bar-line example](http://jtblin.github.io/angular-chart.js/examples/dataset-override.html).
8186

82-
You can create mixed type chart using the `chart-dataset-override`, see [example](examples/dataset-override.html).
87+
See also [stacked bar example](http://jtblin.github.io/angular-chart.js/examples/stacked-bars.html).
8388

8489
# Example
8590

@@ -135,7 +140,7 @@ See [a simple AMD example](examples/amd.js)
135140
## CommonJS e.g. webpack
136141

137142
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).
143+
[webpack](http://webpack.github.io/), see a [webpack example](examples/webpack.commonjs.js).
139144

140145
# Reactive
141146

@@ -181,8 +186,10 @@ For IE8 and older browsers, you will need
181186
to include [excanvas](https://code.google.com/p/explorercanvas/wiki/Instructions).
182187
You will also need a [shim](https://github.com/es-shims/es5-shim) for ES5 functions.
183188

184-
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
185-
[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).
189+
You also need to have ```height``` and ```width``` attributes for the ```<canvas>``` tag of your chart
190+
if using IE8 and older browsers. If you *do not* have these attributes, you will need a
191+
[getComputedStyle shim](https://github.com/Financial-Times/polyfill-service/blob/master/polyfills/getComputedStyle/polyfill.js)
192+
and the line ```document.defaultView = window;```, but there still may be errors (due to code in Chart.js).
186193

187194
```html
188195
<head>

‎angular-chart.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@
4949
.directive('chartDoughnut', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('doughnut'); }])
5050
.directive('chartPie', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('pie'); }])
5151
.directive('chartPolarArea', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('polarArea'); }])
52+
.directive('chartBubble', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('bubble'); }])
5253
.name;
5354

5455
/**
@@ -267,8 +268,7 @@
267268
}
268269

269270
function hasData (scope) {
270-
return scope.chartData && scope.chartData.length &&
271-
scope.chartLabels && scope.chartLabels.length;
271+
return scope.chartData && scope.chartData.length;
272272
}
273273

274274
function getChartColorFn (scope) {

‎dist/angular-chart.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@
5858
.directive('chartDoughnut', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('doughnut'); }])
5959
.directive('chartPie', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('pie'); }])
6060
.directive('chartPolarArea', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('polarArea'); }])
61+
.directive('chartBubble', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('bubble'); }])
6162
.name;
6263

6364
/**
@@ -276,8 +277,7 @@
276277
}
277278

278279
function hasData (scope) {
279-
return scope.chartData && scope.chartData.length &&
280-
scope.chartLabels && scope.chartLabels.length;
280+
return scope.chartData && scope.chartData.length;
281281
}
282282

283283
function getChartColorFn (scope) {

‎dist/angular-chart.js.tar.gz‎

-3 Bytes
Binary file not shown.

‎dist/angular-chart.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/angular-chart.min.js.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)