@rfprodz/client-d3-charts 1.3.2 → 1.3.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/esm2022/lib/components/bar-chart/bar-chart.component.mjs +3 -3
- package/esm2022/lib/components/chart-examples/chart-examples.component.mjs +3 -3
- package/esm2022/lib/components/force-directed-chart/force-directed-chart.component.mjs +3 -3
- package/esm2022/lib/components/line-chart/line-chart.component.mjs +3 -3
- package/esm2022/lib/components/pie-chart/pie-chart.component.mjs +3 -3
- package/esm2022/lib/components/radar-chart/radar-chart.component.mjs +3 -3
- package/esm2022/lib/d3-charts.module.mjs +4 -4
- package/fesm2022/rfprodz-client-d3-charts.mjs +22 -22
- package/package.json +4 -4
|
@@ -62,11 +62,11 @@ class AppBarChartComponent {
|
|
|
62
62
|
this.drawChart();
|
|
63
63
|
}
|
|
64
64
|
}
|
|
65
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
66
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
65
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppBarChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
66
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppBarChartComponent, selector: "app-bar-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
67
67
|
}
|
|
68
68
|
export { AppBarChartComponent };
|
|
69
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
69
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppBarChartComponent, decorators: [{
|
|
70
70
|
type: Component,
|
|
71
71
|
args: [{ selector: 'app-bar-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"] }]
|
|
72
72
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -217,11 +217,11 @@ class AppChartExamplesComponent {
|
|
|
217
217
|
chartTitle: 'Example force directed chart',
|
|
218
218
|
};
|
|
219
219
|
}
|
|
220
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
221
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
220
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppChartExamplesComponent, deps: [{ token: i1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
221
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppChartExamplesComponent, selector: "app-chart-examples", ngImport: i0, template: "<div class=\"container\" *ngIf=\"barChartConfig$ | async as config\">\n <app-bar-chart [chartId]=\"'bar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-bar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"lineChartConfig$ | async as config\">\n <app-line-chart [chartId]=\"'line-example-1'\" [data]=\"[config.data[0]]\" [options]=\"config.options\"></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-2'\" [data]=\"[config.data[1]]\" [options]=\"config.optionsDateDdMmYy\"></app-line-chart>\n\n <app-line-chart\n [chartId]=\"'line-example-3'\"\n [data]=\"[config.data[1], config.data[2]]\"\n [options]=\"config.optionsDateDdMmYyyy\"\n ></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-4'\" [data]=\"config.data\" [options]=\"config.optionsDateMmYyyy\"></app-line-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"radarChartConfig$ | async as config\">\n <app-radar-chart [chartId]=\"'radar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-radar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"pieChartConfig$ | async as config\">\n <app-pie-chart [chartId]=\"'pie-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-pie-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"forceDirectedChartConfig$ | async as config\">\n <app-force-directed-chart\n [chartId]=\"'force-directed-example-1'\"\n [data]=\"config.data\"\n [options]=\"config.options\"\n ></app-force-directed-chart>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}:host .container{display:flex;flex:1 1 auto;flex-wrap:wrap;width:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.AppPieChartComponent, selector: "app-pie-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: i4.AppRadarChartComponent, selector: "app-radar-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: i5.AppForceDirectedChartComponent, selector: "app-force-directed-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: i6.AppBarChartComponent, selector: "app-bar-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: i7.AppLineChartComponent, selector: "app-line-chart", inputs: ["chartId", "data", "options"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
222
222
|
}
|
|
223
223
|
export { AppChartExamplesComponent };
|
|
224
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
224
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppChartExamplesComponent, decorators: [{
|
|
225
225
|
type: Component,
|
|
226
226
|
args: [{ selector: 'app-chart-examples', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" *ngIf=\"barChartConfig$ | async as config\">\n <app-bar-chart [chartId]=\"'bar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-bar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"lineChartConfig$ | async as config\">\n <app-line-chart [chartId]=\"'line-example-1'\" [data]=\"[config.data[0]]\" [options]=\"config.options\"></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-2'\" [data]=\"[config.data[1]]\" [options]=\"config.optionsDateDdMmYy\"></app-line-chart>\n\n <app-line-chart\n [chartId]=\"'line-example-3'\"\n [data]=\"[config.data[1], config.data[2]]\"\n [options]=\"config.optionsDateDdMmYyyy\"\n ></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-4'\" [data]=\"config.data\" [options]=\"config.optionsDateMmYyyy\"></app-line-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"radarChartConfig$ | async as config\">\n <app-radar-chart [chartId]=\"'radar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-radar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"pieChartConfig$ | async as config\">\n <app-pie-chart [chartId]=\"'pie-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-pie-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"forceDirectedChartConfig$ | async as config\">\n <app-force-directed-chart\n [chartId]=\"'force-directed-example-1'\"\n [data]=\"config.data\"\n [options]=\"config.options\"\n ></app-force-directed-chart>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}:host .container{display:flex;flex:1 1 auto;flex-wrap:wrap;width:100%}\n"] }]
|
|
227
227
|
}], ctorParameters: function () { return [{ type: i1.BreakpointObserver }]; } });
|
|
@@ -67,11 +67,11 @@ class AppForceDirectedChartComponent {
|
|
|
67
67
|
this.drawChart();
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
71
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
70
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppForceDirectedChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
71
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppForceDirectedChartComponent, selector: "app-force-directed-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
72
72
|
}
|
|
73
73
|
export { AppForceDirectedChartComponent };
|
|
74
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
74
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppForceDirectedChartComponent, decorators: [{
|
|
75
75
|
type: Component,
|
|
76
76
|
args: [{ selector: 'app-force-directed-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"] }]
|
|
77
77
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -67,11 +67,11 @@ class AppLineChartComponent {
|
|
|
67
67
|
this.drawChart();
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
71
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
70
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppLineChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
71
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppLineChartComponent, selector: "app-line-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
72
72
|
}
|
|
73
73
|
export { AppLineChartComponent };
|
|
74
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
74
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppLineChartComponent, decorators: [{
|
|
75
75
|
type: Component,
|
|
76
76
|
args: [{ selector: 'app-line-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"] }]
|
|
77
77
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -65,11 +65,11 @@ class AppPieChartComponent {
|
|
|
65
65
|
this.drawChart();
|
|
66
66
|
}
|
|
67
67
|
}
|
|
68
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
69
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
68
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppPieChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
69
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppPieChartComponent, selector: "app-pie-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host canvas{width:auto!important;height:150px}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
70
70
|
}
|
|
71
71
|
export { AppPieChartComponent };
|
|
72
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
72
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppPieChartComponent, decorators: [{
|
|
73
73
|
type: Component,
|
|
74
74
|
args: [{ selector: 'app-pie-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host canvas{width:auto!important;height:150px}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"] }]
|
|
75
75
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -77,11 +77,11 @@ class AppRadarChartComponent {
|
|
|
77
77
|
this.drawChart();
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
81
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
80
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppRadarChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
81
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppRadarChartComponent, selector: "app-radar-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
82
82
|
}
|
|
83
83
|
export { AppRadarChartComponent };
|
|
84
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
84
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppRadarChartComponent, decorators: [{
|
|
85
85
|
type: Component,
|
|
86
86
|
args: [{ selector: 'app-radar-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"] }]
|
|
87
87
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -8,8 +8,8 @@ import { AppPieChartComponent } from './components/pie-chart/pie-chart.component
|
|
|
8
8
|
import { AppRadarChartComponent } from './components/radar-chart/radar-chart.component';
|
|
9
9
|
import * as i0 from "@angular/core";
|
|
10
10
|
class AppD3ChartsModule {
|
|
11
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
12
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.
|
|
11
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
12
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, declarations: [AppPieChartComponent,
|
|
13
13
|
AppRadarChartComponent,
|
|
14
14
|
AppForceDirectedChartComponent,
|
|
15
15
|
AppBarChartComponent,
|
|
@@ -20,10 +20,10 @@ class AppD3ChartsModule {
|
|
|
20
20
|
AppBarChartComponent,
|
|
21
21
|
AppLineChartComponent,
|
|
22
22
|
AppChartExamplesComponent] }); }
|
|
23
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.
|
|
23
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, imports: [CommonModule] }); }
|
|
24
24
|
}
|
|
25
25
|
export { AppD3ChartsModule };
|
|
26
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, decorators: [{
|
|
27
27
|
type: NgModule,
|
|
28
28
|
args: [{
|
|
29
29
|
imports: [CommonModule],
|
|
@@ -1335,10 +1335,10 @@ class AppBarChartComponent {
|
|
|
1335
1335
|
this.drawChart();
|
|
1336
1336
|
}
|
|
1337
1337
|
}
|
|
1338
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
1339
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
1338
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppBarChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1339
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppBarChartComponent, selector: "app-bar-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1340
1340
|
}
|
|
1341
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
1341
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppBarChartComponent, decorators: [{
|
|
1342
1342
|
type: Component,
|
|
1343
1343
|
args: [{ selector: 'app-bar-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"] }]
|
|
1344
1344
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -1421,10 +1421,10 @@ class AppPieChartComponent {
|
|
|
1421
1421
|
this.drawChart();
|
|
1422
1422
|
}
|
|
1423
1423
|
}
|
|
1424
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
1425
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
1424
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppPieChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1425
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppPieChartComponent, selector: "app-pie-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host canvas{width:auto!important;height:150px}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1426
1426
|
}
|
|
1427
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
1427
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppPieChartComponent, decorators: [{
|
|
1428
1428
|
type: Component,
|
|
1429
1429
|
args: [{ selector: 'app-pie-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host canvas{width:auto!important;height:150px}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"] }]
|
|
1430
1430
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -1518,10 +1518,10 @@ class AppRadarChartComponent {
|
|
|
1518
1518
|
this.drawChart();
|
|
1519
1519
|
}
|
|
1520
1520
|
}
|
|
1521
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
1522
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
1521
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppRadarChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1522
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppRadarChartComponent, selector: "app-radar-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1523
1523
|
}
|
|
1524
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
1524
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppRadarChartComponent, decorators: [{
|
|
1525
1525
|
type: Component,
|
|
1526
1526
|
args: [{ selector: 'app-radar-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"] }]
|
|
1527
1527
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -1606,10 +1606,10 @@ class AppForceDirectedChartComponent {
|
|
|
1606
1606
|
this.drawChart();
|
|
1607
1607
|
}
|
|
1608
1608
|
}
|
|
1609
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
1610
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
1609
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppForceDirectedChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1610
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppForceDirectedChartComponent, selector: "app-force-directed-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1611
1611
|
}
|
|
1612
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
1612
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppForceDirectedChartComponent, decorators: [{
|
|
1613
1613
|
type: Component,
|
|
1614
1614
|
args: [{ selector: 'app-force-directed-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\">\n <div id=\"{{ chartId }}\" #container></div>\n\n <small class=\"container--chart-title\">{{ options.chartTitle }}</small>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}:host .container--chart-title{display:block;text-align:center}\n"] }]
|
|
1615
1615
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -1693,10 +1693,10 @@ class AppLineChartComponent {
|
|
|
1693
1693
|
this.drawChart();
|
|
1694
1694
|
}
|
|
1695
1695
|
}
|
|
1696
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
1697
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
1696
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppLineChartComponent, deps: [{ token: DOCUMENT }, { token: D3_CHART_FACTORY }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1697
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppLineChartComponent, selector: "app-line-chart", inputs: { chartId: "chartId", data: "data", options: "options" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1698
1698
|
}
|
|
1699
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
1699
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppLineChartComponent, decorators: [{
|
|
1700
1700
|
type: Component,
|
|
1701
1701
|
args: [{ selector: 'app-line-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" id=\"{{ chartId }}\" #container></div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center}:host .container{flex:0 1 auto}\n"] }]
|
|
1702
1702
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
@@ -1924,17 +1924,17 @@ class AppChartExamplesComponent {
|
|
|
1924
1924
|
chartTitle: 'Example force directed chart',
|
|
1925
1925
|
};
|
|
1926
1926
|
}
|
|
1927
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
1928
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.
|
|
1927
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppChartExamplesComponent, deps: [{ token: i1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1928
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: AppChartExamplesComponent, selector: "app-chart-examples", ngImport: i0, template: "<div class=\"container\" *ngIf=\"barChartConfig$ | async as config\">\n <app-bar-chart [chartId]=\"'bar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-bar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"lineChartConfig$ | async as config\">\n <app-line-chart [chartId]=\"'line-example-1'\" [data]=\"[config.data[0]]\" [options]=\"config.options\"></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-2'\" [data]=\"[config.data[1]]\" [options]=\"config.optionsDateDdMmYy\"></app-line-chart>\n\n <app-line-chart\n [chartId]=\"'line-example-3'\"\n [data]=\"[config.data[1], config.data[2]]\"\n [options]=\"config.optionsDateDdMmYyyy\"\n ></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-4'\" [data]=\"config.data\" [options]=\"config.optionsDateMmYyyy\"></app-line-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"radarChartConfig$ | async as config\">\n <app-radar-chart [chartId]=\"'radar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-radar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"pieChartConfig$ | async as config\">\n <app-pie-chart [chartId]=\"'pie-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-pie-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"forceDirectedChartConfig$ | async as config\">\n <app-force-directed-chart\n [chartId]=\"'force-directed-example-1'\"\n [data]=\"config.data\"\n [options]=\"config.options\"\n ></app-force-directed-chart>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}:host .container{display:flex;flex:1 1 auto;flex-wrap:wrap;width:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: AppPieChartComponent, selector: "app-pie-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: AppRadarChartComponent, selector: "app-radar-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: AppForceDirectedChartComponent, selector: "app-force-directed-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: AppBarChartComponent, selector: "app-bar-chart", inputs: ["chartId", "data", "options"] }, { kind: "component", type: AppLineChartComponent, selector: "app-line-chart", inputs: ["chartId", "data", "options"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1929
1929
|
}
|
|
1930
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
1930
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppChartExamplesComponent, decorators: [{
|
|
1931
1931
|
type: Component,
|
|
1932
1932
|
args: [{ selector: 'app-chart-examples', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"container\" *ngIf=\"barChartConfig$ | async as config\">\n <app-bar-chart [chartId]=\"'bar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-bar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"lineChartConfig$ | async as config\">\n <app-line-chart [chartId]=\"'line-example-1'\" [data]=\"[config.data[0]]\" [options]=\"config.options\"></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-2'\" [data]=\"[config.data[1]]\" [options]=\"config.optionsDateDdMmYy\"></app-line-chart>\n\n <app-line-chart\n [chartId]=\"'line-example-3'\"\n [data]=\"[config.data[1], config.data[2]]\"\n [options]=\"config.optionsDateDdMmYyyy\"\n ></app-line-chart>\n\n <app-line-chart [chartId]=\"'line-example-4'\" [data]=\"config.data\" [options]=\"config.optionsDateMmYyyy\"></app-line-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"radarChartConfig$ | async as config\">\n <app-radar-chart [chartId]=\"'radar-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-radar-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"pieChartConfig$ | async as config\">\n <app-pie-chart [chartId]=\"'pie-example-1'\" [data]=\"config.data\" [options]=\"config.options\"></app-pie-chart>\n</div>\n\n<hr [ngStyle]=\"{ width: '100%' }\" />\n\n<div class=\"container\" *ngIf=\"forceDirectedChartConfig$ | async as config\">\n <app-force-directed-chart\n [chartId]=\"'force-directed-example-1'\"\n [data]=\"config.data\"\n [options]=\"config.options\"\n ></app-force-directed-chart>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}:host .container{display:flex;flex:1 1 auto;flex-wrap:wrap;width:100%}\n"] }]
|
|
1933
1933
|
}], ctorParameters: function () { return [{ type: i1.BreakpointObserver }]; } });
|
|
1934
1934
|
|
|
1935
1935
|
class AppD3ChartsModule {
|
|
1936
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.
|
|
1937
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.
|
|
1936
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1937
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, declarations: [AppPieChartComponent,
|
|
1938
1938
|
AppRadarChartComponent,
|
|
1939
1939
|
AppForceDirectedChartComponent,
|
|
1940
1940
|
AppBarChartComponent,
|
|
@@ -1945,9 +1945,9 @@ class AppD3ChartsModule {
|
|
|
1945
1945
|
AppBarChartComponent,
|
|
1946
1946
|
AppLineChartComponent,
|
|
1947
1947
|
AppChartExamplesComponent] }); }
|
|
1948
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.
|
|
1948
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, imports: [CommonModule] }); }
|
|
1949
1949
|
}
|
|
1950
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.
|
|
1950
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: AppD3ChartsModule, decorators: [{
|
|
1951
1951
|
type: NgModule,
|
|
1952
1952
|
args: [{
|
|
1953
1953
|
imports: [CommonModule],
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rfprodz/client-d3-charts",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.3",
|
|
4
4
|
"description": "Angular chart components based on D3JS (https://d3js.org).",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular-charts",
|
|
@@ -21,11 +21,11 @@
|
|
|
21
21
|
"license": "MIT",
|
|
22
22
|
"author": "rfprod <zoidenmacht@zoho.com>",
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"tslib": "2.5.
|
|
24
|
+
"tslib": "2.5.1"
|
|
25
25
|
},
|
|
26
26
|
"peerDependencies": {
|
|
27
|
-
"@angular/common": "16.0.
|
|
28
|
-
"@angular/core": "16.0.
|
|
27
|
+
"@angular/common": "16.0.2",
|
|
28
|
+
"@angular/core": "16.0.2",
|
|
29
29
|
"@types/d3": "7.4.0",
|
|
30
30
|
"d3": "7.8.4"
|
|
31
31
|
},
|