@kiwibit/chart 19.0.0 → 20.0.0
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 +164 -0
- package/karma.conf.js +44 -0
- package/ng-package.json +10 -0
- package/package.json +15 -27
- package/src/lib/components/chart.component.ts +76 -0
- package/src/lib/constants/chart.constants.ts +5 -0
- package/src/lib/directives/kiwi-chart.directive.ts +488 -0
- package/{lib/models/chart.models.d.ts → src/lib/models/chart.models.ts} +183 -173
- package/src/public-api.ts +6 -0
- package/src/test.ts +15 -0
- package/tsconfig.lib.json +15 -0
- package/tsconfig.lib.prod.json +10 -0
- package/tsconfig.spec.json +17 -0
- package/fesm2022/kiwibit-chart.mjs +0 -588
- package/fesm2022/kiwibit-chart.mjs.map +0 -1
- package/index.d.ts +0 -5
- package/lib/components/chart.component.d.ts +0 -52
- package/lib/constants/chart.constants.d.ts +0 -5
- package/lib/directives/kiwi-chart.directive.d.ts +0 -104
- package/public-api.d.ts +0 -2
|
@@ -1,173 +1,183 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Interface to define the Chart model.
|
|
3
|
-
*
|
|
4
|
-
* @export
|
|
5
|
-
* @interface Chart
|
|
6
|
-
*/
|
|
7
|
-
export interface Chart {
|
|
8
|
-
title: string;
|
|
9
|
-
showLegend?: boolean;
|
|
10
|
-
xAxisType: AxisType;
|
|
11
|
-
xAxisName: string;
|
|
12
|
-
xAxisUom?: string;
|
|
13
|
-
xMin?: number;
|
|
14
|
-
xMax?: number;
|
|
15
|
-
yAxisType: AxisType;
|
|
16
|
-
yAxisName: string;
|
|
17
|
-
yAxisUom?: string;
|
|
18
|
-
yMin?: number;
|
|
19
|
-
yMax?: number;
|
|
20
|
-
/**
|
|
21
|
-
* The maximum decimals that can have the values on the x and y axes.
|
|
22
|
-
* If omitted the default is 3 decimals.
|
|
23
|
-
*
|
|
24
|
-
* @type {number}
|
|
25
|
-
* @memberof Chart
|
|
26
|
-
*/
|
|
27
|
-
maxAxesDecimals?: number;
|
|
28
|
-
/**
|
|
29
|
-
* If the chart should have rendering animations.
|
|
30
|
-
*
|
|
31
|
-
* @type {boolean}
|
|
32
|
-
* @memberof Chart
|
|
33
|
-
*/
|
|
34
|
-
hasAnimations?: boolean;
|
|
35
|
-
/**
|
|
36
|
-
* How long the animation should last.
|
|
37
|
-
* Expressed in milliseconds. If omitted the Default is 500 ms.
|
|
38
|
-
*
|
|
39
|
-
* @type {number}
|
|
40
|
-
* @memberof Chart
|
|
41
|
-
*/
|
|
42
|
-
animationDuration?: number;
|
|
43
|
-
/**
|
|
44
|
-
* The list of Shapes that the chart must render.
|
|
45
|
-
* Each Shape corrisponds to a single chart component.
|
|
46
|
-
*
|
|
47
|
-
* @type {Shape[]}
|
|
48
|
-
* @memberof Chart
|
|
49
|
-
*/
|
|
50
|
-
shapes: Shape[];
|
|
51
|
-
/**
|
|
52
|
-
* Adds interaction with the chart, so that when clicking
|
|
53
|
-
* everywhere in the chart area a point gets added and it's coordinate are
|
|
54
|
-
* emitted with an event to the parent component.
|
|
55
|
-
*
|
|
56
|
-
* @type {boolean}
|
|
57
|
-
* @memberof Chart
|
|
58
|
-
*/
|
|
59
|
-
clickToAddPoint?: boolean;
|
|
60
|
-
/**
|
|
61
|
-
* Custom name for the "clickToAddPoint" event related button.
|
|
62
|
-
*
|
|
63
|
-
* @type {string}
|
|
64
|
-
* @memberof Chart
|
|
65
|
-
*/
|
|
66
|
-
addPointCustomName?: string;
|
|
67
|
-
/**
|
|
68
|
-
* Adds the possibility to use the scroll
|
|
69
|
-
* to zoom in/out the chart area.
|
|
70
|
-
*
|
|
71
|
-
* @type {boolean}
|
|
72
|
-
* @memberof Chart
|
|
73
|
-
*/
|
|
74
|
-
scrollToZoom?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* Tells the chart to render or not the grid lines.
|
|
77
|
-
*
|
|
78
|
-
* @type {boolean}
|
|
79
|
-
* @memberof Chart
|
|
80
|
-
*/
|
|
81
|
-
showGrid?: boolean;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
export
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
*
|
|
90
|
-
*
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
*
|
|
98
|
-
*
|
|
99
|
-
*
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
*
|
|
107
|
-
*
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
*
|
|
114
|
-
*
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
*
|
|
121
|
-
*
|
|
122
|
-
*
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
*
|
|
129
|
-
*
|
|
130
|
-
*
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
*
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
export
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Interface to define the Chart model.
|
|
3
|
+
*
|
|
4
|
+
* @export
|
|
5
|
+
* @interface Chart
|
|
6
|
+
*/
|
|
7
|
+
export interface Chart {
|
|
8
|
+
title: string;
|
|
9
|
+
showLegend?: boolean;
|
|
10
|
+
xAxisType: AxisType;
|
|
11
|
+
xAxisName: string;
|
|
12
|
+
xAxisUom?: string;
|
|
13
|
+
xMin?: number;
|
|
14
|
+
xMax?: number;
|
|
15
|
+
yAxisType: AxisType;
|
|
16
|
+
yAxisName: string;
|
|
17
|
+
yAxisUom?: string;
|
|
18
|
+
yMin?: number;
|
|
19
|
+
yMax?: number;
|
|
20
|
+
/**
|
|
21
|
+
* The maximum decimals that can have the values on the x and y axes.
|
|
22
|
+
* If omitted the default is 3 decimals.
|
|
23
|
+
*
|
|
24
|
+
* @type {number}
|
|
25
|
+
* @memberof Chart
|
|
26
|
+
*/
|
|
27
|
+
maxAxesDecimals?: number;
|
|
28
|
+
/**
|
|
29
|
+
* If the chart should have rendering animations.
|
|
30
|
+
*
|
|
31
|
+
* @type {boolean}
|
|
32
|
+
* @memberof Chart
|
|
33
|
+
*/
|
|
34
|
+
hasAnimations?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* How long the animation should last.
|
|
37
|
+
* Expressed in milliseconds. If omitted the Default is 500 ms.
|
|
38
|
+
*
|
|
39
|
+
* @type {number}
|
|
40
|
+
* @memberof Chart
|
|
41
|
+
*/
|
|
42
|
+
animationDuration?: number;
|
|
43
|
+
/**
|
|
44
|
+
* The list of Shapes that the chart must render.
|
|
45
|
+
* Each Shape corrisponds to a single chart component.
|
|
46
|
+
*
|
|
47
|
+
* @type {Shape[]}
|
|
48
|
+
* @memberof Chart
|
|
49
|
+
*/
|
|
50
|
+
shapes: Shape[];
|
|
51
|
+
/**
|
|
52
|
+
* Adds interaction with the chart, so that when clicking
|
|
53
|
+
* everywhere in the chart area a point gets added and it's coordinate are
|
|
54
|
+
* emitted with an event to the parent component.
|
|
55
|
+
*
|
|
56
|
+
* @type {boolean}
|
|
57
|
+
* @memberof Chart
|
|
58
|
+
*/
|
|
59
|
+
clickToAddPoint?: boolean;
|
|
60
|
+
/**
|
|
61
|
+
* Custom name for the "clickToAddPoint" event related button.
|
|
62
|
+
*
|
|
63
|
+
* @type {string}
|
|
64
|
+
* @memberof Chart
|
|
65
|
+
*/
|
|
66
|
+
addPointCustomName?: string;
|
|
67
|
+
/**
|
|
68
|
+
* Adds the possibility to use the scroll
|
|
69
|
+
* to zoom in/out the chart area.
|
|
70
|
+
*
|
|
71
|
+
* @type {boolean}
|
|
72
|
+
* @memberof Chart
|
|
73
|
+
*/
|
|
74
|
+
scrollToZoom?: boolean;
|
|
75
|
+
/**
|
|
76
|
+
* Tells the chart to render or not the grid lines.
|
|
77
|
+
*
|
|
78
|
+
* @type {boolean}
|
|
79
|
+
* @memberof Chart
|
|
80
|
+
*/
|
|
81
|
+
showGrid?: boolean;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export type Shape = Trace;
|
|
85
|
+
|
|
86
|
+
export interface Trace {
|
|
87
|
+
name?: string;
|
|
88
|
+
/**
|
|
89
|
+
* The variant of the Shape, must be of type Trace.
|
|
90
|
+
*
|
|
91
|
+
* @type {ShapeVariant}
|
|
92
|
+
* @memberof Trace
|
|
93
|
+
*/
|
|
94
|
+
variant: ShapeVariant;
|
|
95
|
+
color?: string;
|
|
96
|
+
/**
|
|
97
|
+
* The type of the Trace drawn by the chart.
|
|
98
|
+
* Can be a line or a scatter.
|
|
99
|
+
*
|
|
100
|
+
* @type {TraceType}
|
|
101
|
+
* @memberof Trace
|
|
102
|
+
*/
|
|
103
|
+
type: TraceType;
|
|
104
|
+
width?: number;
|
|
105
|
+
/**
|
|
106
|
+
* The list of points that define the Trace.
|
|
107
|
+
*
|
|
108
|
+
* @type {Point[]}
|
|
109
|
+
* @memberof Trace
|
|
110
|
+
*/
|
|
111
|
+
points: Point[];
|
|
112
|
+
/**
|
|
113
|
+
* Whether to show a smooth curve or a segmented curve.
|
|
114
|
+
*
|
|
115
|
+
* @type {boolean}
|
|
116
|
+
* @memberof Trace
|
|
117
|
+
*/
|
|
118
|
+
smooth?: boolean;
|
|
119
|
+
/**
|
|
120
|
+
* The style of the Trace.
|
|
121
|
+
* Can be solid, dashed or dotted.
|
|
122
|
+
*
|
|
123
|
+
* @type {TraceStyle}
|
|
124
|
+
* @memberof Trace
|
|
125
|
+
*/
|
|
126
|
+
style?: TraceStyle;
|
|
127
|
+
/**
|
|
128
|
+
* Option to make the Trace selected/deselected by default.
|
|
129
|
+
* A deselected Trace is obscured from the chart and can be toggled from the legend.
|
|
130
|
+
*
|
|
131
|
+
* @type {boolean}
|
|
132
|
+
* @memberof Trace
|
|
133
|
+
*/
|
|
134
|
+
selectedByDefault?: boolean;
|
|
135
|
+
opacity?: number;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
export interface Point extends BasePoint {
|
|
139
|
+
name?: string;
|
|
140
|
+
/**
|
|
141
|
+
* Symbol used to represent the point in the chart.
|
|
142
|
+
*
|
|
143
|
+
* @type {PointSymbol}
|
|
144
|
+
* @memberof Point
|
|
145
|
+
*/
|
|
146
|
+
symbol?: PointSymbol;
|
|
147
|
+
symbolSize?: number;
|
|
148
|
+
color?: string;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
export interface BasePoint {
|
|
152
|
+
x: number;
|
|
153
|
+
y: number
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
export enum TraceType {
|
|
157
|
+
LINE = "line",
|
|
158
|
+
SCATTER = "scatter"
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
export enum PointSymbol {
|
|
162
|
+
NONE = "none",
|
|
163
|
+
CIRCLE = "circle",
|
|
164
|
+
TRIANGLE = "triangle",
|
|
165
|
+
PIN = "pin",
|
|
166
|
+
DIAMOND = "diamond"
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
export enum TraceStyle {
|
|
170
|
+
SOLID = "solid",
|
|
171
|
+
DASHED = "dashed",
|
|
172
|
+
DOTTED = "dotted"
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
export enum AxisType {
|
|
176
|
+
VALUE = "value"
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
export enum ShapeVariant {
|
|
180
|
+
TRACE
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
export type ChartTheme = 'default' | 'dark';
|
package/src/test.ts
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
|
|
2
|
+
|
|
3
|
+
import 'zone.js';
|
|
4
|
+
import 'zone.js/testing';
|
|
5
|
+
import { getTestBed } from '@angular/core/testing';
|
|
6
|
+
import {
|
|
7
|
+
BrowserDynamicTestingModule,
|
|
8
|
+
platformBrowserDynamicTesting
|
|
9
|
+
} from '@angular/platform-browser-dynamic/testing';
|
|
10
|
+
|
|
11
|
+
// First, initialize the Angular testing environment.
|
|
12
|
+
getTestBed().initTestEnvironment(
|
|
13
|
+
BrowserDynamicTestingModule,
|
|
14
|
+
platformBrowserDynamicTesting(),
|
|
15
|
+
);
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/* To learn more about this file see: https://angular.io/config/tsconfig. */
|
|
2
|
+
{
|
|
3
|
+
"extends": "../../../tsconfig.json",
|
|
4
|
+
"compilerOptions": {
|
|
5
|
+
"outDir": "../../../out-tsc/lib",
|
|
6
|
+
"declaration": true,
|
|
7
|
+
"declarationMap": true,
|
|
8
|
+
"inlineSources": true,
|
|
9
|
+
"types": []
|
|
10
|
+
},
|
|
11
|
+
"exclude": [
|
|
12
|
+
"src/test.ts",
|
|
13
|
+
"**/*.spec.ts"
|
|
14
|
+
]
|
|
15
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/* To learn more about this file see: https://angular.io/config/tsconfig. */
|
|
2
|
+
{
|
|
3
|
+
"extends": "../../../tsconfig.json",
|
|
4
|
+
"compilerOptions": {
|
|
5
|
+
"outDir": "../../../out-tsc/spec",
|
|
6
|
+
"types": [
|
|
7
|
+
"jasmine"
|
|
8
|
+
]
|
|
9
|
+
},
|
|
10
|
+
"files": [
|
|
11
|
+
"src/test.ts"
|
|
12
|
+
],
|
|
13
|
+
"include": [
|
|
14
|
+
"**/*.spec.ts",
|
|
15
|
+
"**/*.d.ts"
|
|
16
|
+
]
|
|
17
|
+
}
|