@carbon/charts-angular 0.59.0-beta.0 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +51 -0
- package/LICENSE.md +201 -0
- package/README.md +23 -8
- package/{dist/alluvial-chart.component.d.ts → alluvial-chart.component.d.ts} +0 -0
- package/{dist/area-chart-stacked.component.d.ts → area-chart-stacked.component.d.ts} +0 -0
- package/{dist/area-chart.component.d.ts → area-chart.component.d.ts} +0 -0
- package/{dist/bar-chart-grouped.component.d.ts → bar-chart-grouped.component.d.ts} +0 -0
- package/{dist/bar-chart-simple.component.d.ts → bar-chart-simple.component.d.ts} +0 -0
- package/{dist/bar-chart-stacked.component.d.ts → bar-chart-stacked.component.d.ts} +0 -0
- package/{dist/base-chart.component.d.ts → base-chart.component.d.ts} +0 -0
- package/{dist/boxplot-chart.component.d.ts → boxplot-chart.component.d.ts} +0 -0
- package/{dist/bubble-chart.component.d.ts → bubble-chart.component.d.ts} +0 -0
- package/{dist/bullet-chart.component.d.ts → bullet-chart.component.d.ts} +0 -0
- package/{dist/bundles → bundles}/carbon-charts-angular.umd.js +0 -0
- package/{dist/bundles → bundles}/carbon-charts-angular.umd.js.map +0 -0
- package/{dist/bundles → bundles}/carbon-charts-angular.umd.min.js +0 -0
- package/{dist/bundles → bundles}/carbon-charts-angular.umd.min.js.map +0 -0
- package/{dist/carbon-charts-angular.d.ts → carbon-charts-angular.d.ts} +0 -0
- package/{dist/carbon-charts-angular.metadata.json → carbon-charts-angular.metadata.json} +0 -0
- package/{dist/charts.module.d.ts → charts.module.d.ts} +0 -0
- package/{dist/circle-pack-chart.component.d.ts → circle-pack-chart.component.d.ts} +0 -0
- package/{dist/combo-chart.component.d.ts → combo-chart.component.d.ts} +0 -0
- package/{dist/diagrams → diagrams}/card-node/card-node-column.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/card-node/card-node-label.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/card-node/card-node-subtitle.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/card-node/card-node-title.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/card-node/card-node.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/card-node/card-node.module.d.ts +0 -0
- package/{dist/diagrams → diagrams}/configs.d.ts +0 -0
- package/{dist/diagrams → diagrams}/edge/edge.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/edge/edge.module.d.ts +0 -0
- package/{dist/diagrams → diagrams}/marker/marker.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/marker/marker.module.d.ts +0 -0
- package/{dist/diagrams → diagrams}/shape-node/shape-node.component.d.ts +0 -0
- package/{dist/diagrams → diagrams}/shape-node/shape-node.module.d.ts +0 -0
- package/{dist/donut-chart.component.d.ts → donut-chart.component.d.ts} +0 -0
- package/{dist/esm2015 → esm2015}/alluvial-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/area-chart-stacked.component.js +0 -0
- package/{dist/esm2015 → esm2015}/area-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/bar-chart-grouped.component.js +0 -0
- package/{dist/esm2015 → esm2015}/bar-chart-simple.component.js +0 -0
- package/{dist/esm2015 → esm2015}/bar-chart-stacked.component.js +0 -0
- package/{dist/esm2015 → esm2015}/base-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/boxplot-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/bubble-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/bullet-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/carbon-charts-angular.js +0 -0
- package/{dist/esm2015 → esm2015}/charts.module.js +0 -0
- package/{dist/esm2015 → esm2015}/circle-pack-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/combo-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/card-node/card-node-column.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/card-node/card-node-label.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/card-node/card-node-subtitle.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/card-node/card-node-title.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/card-node/card-node.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/card-node/card-node.module.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/configs.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/edge/edge.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/edge/edge.module.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/marker/marker.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/marker/marker.module.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/shape-node/shape-node.component.js +0 -0
- package/{dist/esm2015 → esm2015}/diagrams/shape-node/shape-node.module.js +0 -0
- package/{dist/esm2015 → esm2015}/donut-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/gauge-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/heatmap-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/histogram-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/index.js +0 -0
- package/{dist/esm2015 → esm2015}/line-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/lollipop-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/meter-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/pie-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/radar-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/scatter-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/tree-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/treemap-chart.component.js +0 -0
- package/{dist/esm2015 → esm2015}/wordcloud-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/alluvial-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/area-chart-stacked.component.js +0 -0
- package/{dist/esm5 → esm5}/area-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/bar-chart-grouped.component.js +0 -0
- package/{dist/esm5 → esm5}/bar-chart-simple.component.js +0 -0
- package/{dist/esm5 → esm5}/bar-chart-stacked.component.js +0 -0
- package/{dist/esm5 → esm5}/base-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/boxplot-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/bubble-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/bullet-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/carbon-charts-angular.js +0 -0
- package/{dist/esm5 → esm5}/charts.module.js +0 -0
- package/{dist/esm5 → esm5}/circle-pack-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/combo-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/card-node/card-node-column.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/card-node/card-node-label.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/card-node/card-node-subtitle.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/card-node/card-node-title.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/card-node/card-node.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/card-node/card-node.module.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/configs.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/edge/edge.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/edge/edge.module.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/marker/marker.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/marker/marker.module.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/shape-node/shape-node.component.js +0 -0
- package/{dist/esm5 → esm5}/diagrams/shape-node/shape-node.module.js +0 -0
- package/{dist/esm5 → esm5}/donut-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/gauge-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/heatmap-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/histogram-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/index.js +0 -0
- package/{dist/esm5 → esm5}/line-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/lollipop-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/meter-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/pie-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/radar-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/scatter-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/tree-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/treemap-chart.component.js +0 -0
- package/{dist/esm5 → esm5}/wordcloud-chart.component.js +0 -0
- package/{dist/fesm2015 → fesm2015}/carbon-charts-angular.js +0 -0
- package/{dist/fesm2015 → fesm2015}/carbon-charts-angular.js.map +0 -0
- package/{dist/fesm5 → fesm5}/carbon-charts-angular.js +0 -0
- package/{dist/fesm5 → fesm5}/carbon-charts-angular.js.map +0 -0
- package/{dist/gauge-chart.component.d.ts → gauge-chart.component.d.ts} +0 -0
- package/{dist/heatmap-chart.component.d.ts → heatmap-chart.component.d.ts} +0 -0
- package/{dist/histogram-chart.component.d.ts → histogram-chart.component.d.ts} +0 -0
- package/{dist/index.d.ts → index.d.ts} +0 -0
- package/{dist/line-chart.component.d.ts → line-chart.component.d.ts} +0 -0
- package/{dist/lollipop-chart.component.d.ts → lollipop-chart.component.d.ts} +0 -0
- package/{dist/meter-chart.component.d.ts → meter-chart.component.d.ts} +0 -0
- package/package.json +108 -103
- package/{dist/pie-chart.component.d.ts → pie-chart.component.d.ts} +0 -0
- package/{dist/radar-chart.component.d.ts → radar-chart.component.d.ts} +0 -0
- package/{dist/scatter-chart.component.d.ts → scatter-chart.component.d.ts} +0 -0
- package/{dist/tree-chart.component.d.ts → tree-chart.component.d.ts} +0 -0
- package/{dist/treemap-chart.component.d.ts → treemap-chart.component.d.ts} +0 -0
- package/{dist/wordcloud-chart.component.d.ts → wordcloud-chart.component.d.ts} +0 -0
- package/.storybook/addons.js +0 -2
- package/.storybook/assets/logo.svg +0 -1
- package/.storybook/assets/share.png +0 -0
- package/.storybook/assets/welcome.png +0 -0
- package/.storybook/config.js +0 -22
- package/.storybook/manager-head.html +0 -45
- package/.storybook/preview-head.html +0 -10
- package/.storybook/tsconfig.json +0 -10
- package/angular.json +0 -68
- package/build.sh +0 -13
- package/carbon.yml +0 -275
- package/dist/CHANGELOG.md +0 -3168
- package/dist/README.md +0 -40
- package/dist/package.json +0 -109
- package/ng-package.json +0 -8
- package/src/alluvial-chart.component.ts +0 -34
- package/src/area-chart-stacked.component.ts +0 -34
- package/src/area-chart.component.ts +0 -37
- package/src/bar-chart-grouped.component.ts +0 -34
- package/src/bar-chart-simple.component.ts +0 -34
- package/src/bar-chart-stacked.component.ts +0 -34
- package/src/base-chart.component.ts +0 -102
- package/src/boxplot-chart.component.ts +0 -34
- package/src/bubble-chart.component.ts +0 -34
- package/src/bullet-chart.component.ts +0 -34
- package/src/charts.module.ts +0 -87
- package/src/circle-pack-chart.component.ts +0 -34
- package/src/combo-chart.component.ts +0 -33
- package/src/diagrams/card-node/card-node-column.component.ts +0 -22
- package/src/diagrams/card-node/card-node-label.component.ts +0 -15
- package/src/diagrams/card-node/card-node-subtitle.component.ts +0 -15
- package/src/diagrams/card-node/card-node-title.component.ts +0 -15
- package/src/diagrams/card-node/card-node.component.ts +0 -100
- package/src/diagrams/card-node/card-node.module.ts +0 -18
- package/src/diagrams/configs.ts +0 -1
- package/src/diagrams/edge/edge.component.ts +0 -45
- package/src/diagrams/edge/edge.module.ts +0 -11
- package/src/diagrams/marker/marker.component.ts +0 -68
- package/src/diagrams/marker/marker.module.ts +0 -43
- package/src/diagrams/shape-node/shape-node.component.ts +0 -133
- package/src/diagrams/shape-node/shape-node.module.ts +0 -11
- package/src/donut-chart.component.ts +0 -34
- package/src/gauge-chart.component.ts +0 -34
- package/src/heatmap-chart.component.ts +0 -34
- package/src/histogram-chart.component.ts +0 -34
- package/src/index.ts +0 -44
- package/src/line-chart.component.ts +0 -34
- package/src/lollipop-chart.component.ts +0 -34
- package/src/meter-chart.component.ts +0 -33
- package/src/pie-chart.component.ts +0 -34
- package/src/radar-chart.component.ts +0 -34
- package/src/scatter-chart.component.ts +0 -34
- package/src/tree-chart.component.ts +0 -34
- package/src/treemap-chart.component.ts +0 -34
- package/src/wordcloud-chart.component.ts +0 -34
- package/stories/all.stories.ts +0 -99
- package/stories/diagrams/0_diagram.stories.ts +0 -224
- package/stories/diagrams/card-node.stories.ts +0 -181
- package/stories/diagrams/edge.stories.ts +0 -127
- package/stories/diagrams/marker.stories.ts +0 -140
- package/stories/diagrams/shape-node.stories.ts +0 -98
- package/tsconfig.json +0 -30
- package/tslint.json +0 -95
package/dist/README.md
DELETED
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
# `@carbon/charts-angular`
|
|
2
|
-
|
|
3
|
-
> Carbon Charting Angular Wrappers
|
|
4
|
-
|
|
5
|
-
**[Storybook demos](https://carbon-design-system.github.io/carbon-charts/angular)**
|
|
6
|
-
|
|
7
|
-
**[Storybook demo sources](https://github.com/carbon-design-system/carbon-charts/tree/master/packages/core/demo/data)**
|
|
8
|
-
|
|
9
|
-
**[Angular 13 example](https://github.com/nstuyvesant/carbon-charts-angular-13)**
|
|
10
|
-
|
|
11
|
-
## Getting started
|
|
12
|
-
|
|
13
|
-
Run the following command using [npm](https://www.npmjs.com/):
|
|
14
|
-
|
|
15
|
-
```bash
|
|
16
|
-
npm install -S @carbon/charts @carbon/charts-angular d3
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
If you prefer [Yarn](https://yarnpkg.com/en/), use the following command
|
|
20
|
-
instead:
|
|
21
|
-
|
|
22
|
-
```bash
|
|
23
|
-
yarn add @carbon/charts @carbon/charts-angular d3
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
**Note:** you'd also need to install `carbon-components` if you're not using a bundled version of the library.
|
|
27
|
-
|
|
28
|
-
## Step-by-step instructions
|
|
29
|
-
Read [here](https://carbon-design-system.github.io/carbon-charts/?path=/story/docs-getting-started--angular)
|
|
30
|
-
|
|
31
|
-
## Charting data & options
|
|
32
|
-
Although we will definitely introduce new models in the future as we start shipping new components such as maps, Data and options follow the same model in all charts, with minor exceptions and differences in specific components.
|
|
33
|
-
|
|
34
|
-
For instance in the case of a donut chart you're able to pass in an additional field called `center` in your options configuring the donut center.
|
|
35
|
-
|
|
36
|
-
For instructions on using the **tabular data format**, see [here](https://carbon-design-system.github.io/carbon-charts/?path=/story/docs-tutorials--tabular-data-format)
|
|
37
|
-
|
|
38
|
-
There are also additional options available depending on the chart type being used, [see our demo examples here](https://github.com/carbon-design-system/carbon-charts/tree/master/packages/core/demo/data).
|
|
39
|
-
|
|
40
|
-
Customizable options (specific to chart type) can be found [here](https://carbon-design-system.github.io/carbon-charts/documentation/modules/_interfaces_charts_.html)
|
package/dist/package.json
DELETED
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@carbon/charts-angular",
|
|
3
|
-
"version": "0.58.1",
|
|
4
|
-
"description": "Carbon charting components for Angular",
|
|
5
|
-
"main": "bundles/carbon-charts-angular.umd.js",
|
|
6
|
-
"repository": {
|
|
7
|
-
"type": "git",
|
|
8
|
-
"url": "git@github.com:carbon-design-system/carbon-charts.git",
|
|
9
|
-
"homepage": "https://carbon-design-system.github.io/carbon-charts/angular/"
|
|
10
|
-
},
|
|
11
|
-
"license": "Apache-2.0",
|
|
12
|
-
"author": "IBM",
|
|
13
|
-
"keywords": [
|
|
14
|
-
"carbon",
|
|
15
|
-
"charts",
|
|
16
|
-
"angular",
|
|
17
|
-
"dataviz",
|
|
18
|
-
"data-visualization",
|
|
19
|
-
"visualizations",
|
|
20
|
-
"d3",
|
|
21
|
-
"svg",
|
|
22
|
-
"component",
|
|
23
|
-
"components",
|
|
24
|
-
"css",
|
|
25
|
-
"html",
|
|
26
|
-
"ibm",
|
|
27
|
-
"typescript",
|
|
28
|
-
"javascript",
|
|
29
|
-
"js",
|
|
30
|
-
"library",
|
|
31
|
-
"pattern",
|
|
32
|
-
"patterns",
|
|
33
|
-
"sass",
|
|
34
|
-
"scss"
|
|
35
|
-
],
|
|
36
|
-
"dependencies": {
|
|
37
|
-
"@carbon/charts": "^0.58.1",
|
|
38
|
-
"@carbon/telemetry": "0.1.0",
|
|
39
|
-
"tslib": "^1.9.0"
|
|
40
|
-
},
|
|
41
|
-
"peerDependencies": {
|
|
42
|
-
"@angular/common": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
|
|
43
|
-
"@angular/compiler": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
|
|
44
|
-
"@angular/core": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
|
|
45
|
-
"rxjs": "^6.0.0",
|
|
46
|
-
"zone.js": "^0.8.29 || ^0.9.0 || ^0.10.0 || ^0.11.0"
|
|
47
|
-
},
|
|
48
|
-
"devDependencies": {
|
|
49
|
-
"@angular-devkit/build-angular": "0.13.9",
|
|
50
|
-
"@angular-devkit/build-ng-packagr": "0.13.9",
|
|
51
|
-
"@angular-devkit/core": "8.2.2",
|
|
52
|
-
"@angular/animations": "7.2.15",
|
|
53
|
-
"@angular/cli": "~7.3.9",
|
|
54
|
-
"@angular/common": "7.2.15",
|
|
55
|
-
"@angular/compiler": "7.2.15",
|
|
56
|
-
"@angular/compiler-cli": "7.2.15",
|
|
57
|
-
"@angular/core": "7.2.15",
|
|
58
|
-
"@angular/forms": "7.2.15",
|
|
59
|
-
"@angular/platform-browser": "7.2.15",
|
|
60
|
-
"@angular/platform-browser-dynamic": "7.2.15",
|
|
61
|
-
"@babel/core": "7.3.4",
|
|
62
|
-
"@carbon/icons-angular": "11.2.1",
|
|
63
|
-
"@storybook/addon-knobs": "5.3.12",
|
|
64
|
-
"@storybook/addon-options": "5.3.12",
|
|
65
|
-
"@storybook/angular": "5.3.12",
|
|
66
|
-
"@types/node": "12.11.7",
|
|
67
|
-
"babel-loader": "8.0.5",
|
|
68
|
-
"core-js": "3.0.0",
|
|
69
|
-
"karma-webpack": "4.0.2",
|
|
70
|
-
"ng-packagr": "5.7.1",
|
|
71
|
-
"rxjs": "6.3.3",
|
|
72
|
-
"sass-loader": "8.0.0",
|
|
73
|
-
"tsickle": "0.37.1",
|
|
74
|
-
"tslib": "1.10.0",
|
|
75
|
-
"tslint": "5.20.1",
|
|
76
|
-
"typescript": "3.2.2",
|
|
77
|
-
"zone.js": "0.8.29"
|
|
78
|
-
},
|
|
79
|
-
"publishConfig": {
|
|
80
|
-
"directory": "dist",
|
|
81
|
-
"access": "public"
|
|
82
|
-
},
|
|
83
|
-
"maintainers": [
|
|
84
|
-
{
|
|
85
|
-
"name": "Eliad Moosavi",
|
|
86
|
-
"email": "iliadm@ca.ibm.com",
|
|
87
|
-
"url": "https://github.com/theiliad"
|
|
88
|
-
}
|
|
89
|
-
],
|
|
90
|
-
"contributors": [
|
|
91
|
-
{
|
|
92
|
-
"name": "Eliad Moosavi",
|
|
93
|
-
"email": "iliadm@ca.ibm.com",
|
|
94
|
-
"url": "https://github.com/theiliad"
|
|
95
|
-
}
|
|
96
|
-
],
|
|
97
|
-
"module": "fesm5/carbon-charts-angular.js",
|
|
98
|
-
"es2015": "fesm2015/carbon-charts-angular.js",
|
|
99
|
-
"esm5": "esm5/carbon-charts-angular.js",
|
|
100
|
-
"esm2015": "esm2015/carbon-charts-angular.js",
|
|
101
|
-
"fesm5": "fesm5/carbon-charts-angular.js",
|
|
102
|
-
"fesm2015": "fesm2015/carbon-charts-angular.js",
|
|
103
|
-
"typings": "carbon-charts-angular.d.ts",
|
|
104
|
-
"metadata": "carbon-charts-angular.metadata.json",
|
|
105
|
-
"sideEffects": false,
|
|
106
|
-
"scripts": {
|
|
107
|
-
"postinstall": "carbon-telemetry collect --install"
|
|
108
|
-
}
|
|
109
|
-
}
|
package/ng-package.json
DELETED
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { AlluvialChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `Alluvial` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-alluvial-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class AlluvialChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new AlluvialChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { StackedAreaChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `StackedAreaChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-stacked-area-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class StackedAreaChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new StackedAreaChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { AreaChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `AreaChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-area-chart",
|
|
17
|
-
template: `
|
|
18
|
-
<div #nChart class="ibm-chart-container">
|
|
19
|
-
</div>
|
|
20
|
-
`
|
|
21
|
-
})
|
|
22
|
-
export class AreaChartComponent extends BaseChart implements AfterViewInit {
|
|
23
|
-
/**
|
|
24
|
-
* Runs after view init to create a chart, attach it to `chartRef` and draw it.
|
|
25
|
-
*/
|
|
26
|
-
ngAfterViewInit() {
|
|
27
|
-
this.chart = new AreaChart(
|
|
28
|
-
this.chartRef.nativeElement,
|
|
29
|
-
{
|
|
30
|
-
data: this.data,
|
|
31
|
-
options: this.options
|
|
32
|
-
}
|
|
33
|
-
);
|
|
34
|
-
|
|
35
|
-
Object.assign(this, this.chart);
|
|
36
|
-
}
|
|
37
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { GroupedBarChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `GroupedBarChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-grouped-bar-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class GroupedBarChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new GroupedBarChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { SimpleBarChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `SimpleBarChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-simple-bar-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class SimpleBarChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new SimpleBarChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { StackedBarChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `StackedBarChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-stacked-bar-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class StackedBarChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new StackedBarChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
Input,
|
|
4
|
-
ViewChild,
|
|
5
|
-
OnInit,
|
|
6
|
-
AfterViewInit,
|
|
7
|
-
ElementRef
|
|
8
|
-
} from "@angular/core";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `BaseChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-base-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class BaseChart implements AfterViewInit, OnInit {
|
|
20
|
-
constructor(protected elementRef: ElementRef) {}
|
|
21
|
-
|
|
22
|
-
/**
|
|
23
|
-
* Data passed to charts library for displaying
|
|
24
|
-
*/
|
|
25
|
-
@Input() set data(newData) {
|
|
26
|
-
// If data already exists, that means the chart has been initialized
|
|
27
|
-
const dataExistsAlready = this._data !== null && this._data !== undefined;
|
|
28
|
-
|
|
29
|
-
this._data = newData;
|
|
30
|
-
|
|
31
|
-
if (dataExistsAlready) {
|
|
32
|
-
this.chart.model.setData(newData);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
get data() {
|
|
37
|
-
return this._data;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
/**
|
|
41
|
-
* Options passed to charts library
|
|
42
|
-
*/
|
|
43
|
-
@Input() set options(newOptions) {
|
|
44
|
-
// If data already exists, that means the chart has been initialized
|
|
45
|
-
const optionsExistAlready = this._options !== null && this._options !== undefined;
|
|
46
|
-
|
|
47
|
-
this._options = newOptions;
|
|
48
|
-
|
|
49
|
-
if (optionsExistAlready) {
|
|
50
|
-
this.chart.model.setOptions(newOptions);
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
get options() {
|
|
55
|
-
return this._options;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
/**
|
|
59
|
-
* Chart width
|
|
60
|
-
*/
|
|
61
|
-
@Input() width: any;
|
|
62
|
-
|
|
63
|
-
/**
|
|
64
|
-
* Chart height
|
|
65
|
-
*/
|
|
66
|
-
@Input() height: any;
|
|
67
|
-
|
|
68
|
-
/**
|
|
69
|
-
* Chart container element ref
|
|
70
|
-
*/
|
|
71
|
-
@ViewChild("nChart") chartRef;
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
* Chart object instance
|
|
75
|
-
*
|
|
76
|
-
* You can use this to do whatever you would normally do with a chart if you used
|
|
77
|
-
* charts library directly.
|
|
78
|
-
*/
|
|
79
|
-
chart;
|
|
80
|
-
|
|
81
|
-
private _data: any;
|
|
82
|
-
private _options: any;
|
|
83
|
-
|
|
84
|
-
ngOnInit() {
|
|
85
|
-
// Width prop is mandatory for the wrappers
|
|
86
|
-
if (this.width) {
|
|
87
|
-
this.options.width = this.width;
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
// Height prop is mandatory for the wrappers
|
|
91
|
-
if (this.height) {
|
|
92
|
-
this.options.height = this.height;
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
/**
|
|
97
|
-
* Runs after view init to create a chart, attach it to `chartRef` and draw it.
|
|
98
|
-
*/
|
|
99
|
-
ngAfterViewInit() {
|
|
100
|
-
console.log("You need to implement your own `ngAfterViewInit()` function");
|
|
101
|
-
}
|
|
102
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { BoxplotChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `BoxplotChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-boxplot-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class BoxplotChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new BoxplotChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { BubbleChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `BubbleChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-bubble-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class BubbleChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new BubbleChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Component,
|
|
3
|
-
AfterViewInit
|
|
4
|
-
} from "@angular/core";
|
|
5
|
-
|
|
6
|
-
import { BaseChart } from "./base-chart.component";
|
|
7
|
-
|
|
8
|
-
import { BulletChart } from "@carbon/charts";
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* Wrapper around `BulletChart` in carbon charts library
|
|
12
|
-
*
|
|
13
|
-
* Most functions just call their equivalent from the chart library.
|
|
14
|
-
*/
|
|
15
|
-
@Component({
|
|
16
|
-
selector: "ibm-bullet-chart",
|
|
17
|
-
template: ``
|
|
18
|
-
})
|
|
19
|
-
export class BulletChartComponent extends BaseChart implements AfterViewInit {
|
|
20
|
-
/**
|
|
21
|
-
* Runs after view init to create a chart, attach it to `elementRef` and draw it.
|
|
22
|
-
*/
|
|
23
|
-
ngAfterViewInit() {
|
|
24
|
-
this.chart = new BulletChart(
|
|
25
|
-
this.elementRef.nativeElement,
|
|
26
|
-
{
|
|
27
|
-
data: this.data,
|
|
28
|
-
options: this.options
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
Object.assign(this, this.chart);
|
|
33
|
-
}
|
|
34
|
-
}
|
package/src/charts.module.ts
DELETED
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
import { NgModule } from '@angular/core';
|
|
2
|
-
import { CommonModule } from '@angular/common';
|
|
3
|
-
|
|
4
|
-
import { BaseChart } from './base-chart.component';
|
|
5
|
-
import { AlluvialChartComponent } from './alluvial-chart.component';
|
|
6
|
-
import { AreaChartComponent } from './area-chart.component';
|
|
7
|
-
import { StackedAreaChartComponent } from './area-chart-stacked.component';
|
|
8
|
-
import { SimpleBarChartComponent } from './bar-chart-simple.component';
|
|
9
|
-
import { GroupedBarChartComponent } from './bar-chart-grouped.component';
|
|
10
|
-
import { StackedBarChartComponent } from './bar-chart-stacked.component';
|
|
11
|
-
import { BoxplotChartComponent } from './boxplot-chart.component';
|
|
12
|
-
import { BubbleChartComponent } from './bubble-chart.component';
|
|
13
|
-
import { BulletChartComponent } from './bullet-chart.component';
|
|
14
|
-
import { DonutChartComponent } from './donut-chart.component';
|
|
15
|
-
import { GaugeChartComponent } from './gauge-chart.component';
|
|
16
|
-
import { HistogramChartComponent } from './histogram-chart.component';
|
|
17
|
-
import { LineChartComponent } from './line-chart.component';
|
|
18
|
-
import { LollipopChartComponent } from './lollipop-chart.component';
|
|
19
|
-
import { PieChartComponent } from './pie-chart.component';
|
|
20
|
-
import { ScatterChartComponent } from './scatter-chart.component';
|
|
21
|
-
import { MeterChartComponent } from './meter-chart.component';
|
|
22
|
-
import { RadarChartComponent } from './radar-chart.component';
|
|
23
|
-
import { ComboChartComponent } from './combo-chart.component';
|
|
24
|
-
import { TreeChartComponent } from './tree-chart.component';
|
|
25
|
-
import { TreemapChartComponent } from './treemap-chart.component';
|
|
26
|
-
import { CirclePackChartComponent } from './circle-pack-chart.component';
|
|
27
|
-
import { WordCloudChartComponent } from './wordcloud-chart.component';
|
|
28
|
-
import { HeatmapChartComponent } from './heatmap-chart.component';
|
|
29
|
-
|
|
30
|
-
@NgModule({
|
|
31
|
-
imports: [CommonModule],
|
|
32
|
-
declarations: [
|
|
33
|
-
BaseChart,
|
|
34
|
-
AlluvialChartComponent,
|
|
35
|
-
AreaChartComponent,
|
|
36
|
-
StackedAreaChartComponent,
|
|
37
|
-
SimpleBarChartComponent,
|
|
38
|
-
GroupedBarChartComponent,
|
|
39
|
-
StackedBarChartComponent,
|
|
40
|
-
BoxplotChartComponent,
|
|
41
|
-
BubbleChartComponent,
|
|
42
|
-
BulletChartComponent,
|
|
43
|
-
DonutChartComponent,
|
|
44
|
-
GaugeChartComponent,
|
|
45
|
-
HeatmapChartComponent,
|
|
46
|
-
HistogramChartComponent,
|
|
47
|
-
LineChartComponent,
|
|
48
|
-
LollipopChartComponent,
|
|
49
|
-
PieChartComponent,
|
|
50
|
-
ScatterChartComponent,
|
|
51
|
-
MeterChartComponent,
|
|
52
|
-
RadarChartComponent,
|
|
53
|
-
ComboChartComponent,
|
|
54
|
-
TreeChartComponent,
|
|
55
|
-
TreemapChartComponent,
|
|
56
|
-
CirclePackChartComponent,
|
|
57
|
-
WordCloudChartComponent,
|
|
58
|
-
],
|
|
59
|
-
exports: [
|
|
60
|
-
BaseChart,
|
|
61
|
-
AlluvialChartComponent,
|
|
62
|
-
AreaChartComponent,
|
|
63
|
-
StackedAreaChartComponent,
|
|
64
|
-
SimpleBarChartComponent,
|
|
65
|
-
GroupedBarChartComponent,
|
|
66
|
-
StackedBarChartComponent,
|
|
67
|
-
BoxplotChartComponent,
|
|
68
|
-
BubbleChartComponent,
|
|
69
|
-
BulletChartComponent,
|
|
70
|
-
DonutChartComponent,
|
|
71
|
-
GaugeChartComponent,
|
|
72
|
-
HeatmapChartComponent,
|
|
73
|
-
HistogramChartComponent,
|
|
74
|
-
LineChartComponent,
|
|
75
|
-
LollipopChartComponent,
|
|
76
|
-
PieChartComponent,
|
|
77
|
-
ScatterChartComponent,
|
|
78
|
-
MeterChartComponent,
|
|
79
|
-
RadarChartComponent,
|
|
80
|
-
ComboChartComponent,
|
|
81
|
-
TreeChartComponent,
|
|
82
|
-
TreemapChartComponent,
|
|
83
|
-
CirclePackChartComponent,
|
|
84
|
-
WordCloudChartComponent
|
|
85
|
-
],
|
|
86
|
-
})
|
|
87
|
-
export class ChartsModule {}
|