@oanda/labs-currency-power-balance-widget 1.0.35 → 1.0.37
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 +300 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js +1 -17
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js.map +1 -1
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js +1 -1
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js.map +1 -1
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js +2 -18
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js.map +1 -1
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js +1 -1
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js.map +1 -1
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/formatters.d.ts +1 -1
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/getOption.d.ts +1 -1
- package/package.json +3 -3
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/formatters.ts +2 -25
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts +1 -1
- package/test/chartFormatters.test.ts +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,306 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 1.0.37 (2024-03-07)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
## 1.0.97 (2024-03-06)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## 1.0.96 (2024-03-06)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
## 1.0.95 (2024-03-04)
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## 1.0.94 (2024-02-29)
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
## 1.0.93 (2024-02-28)
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## 1.0.92 (2024-02-28)
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
## 1.0.91 (2024-02-23)
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
## 1.0.90 (2024-02-23)
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
## 1.0.89 (2024-02-21)
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
## 1.0.88 (2024-02-21)
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
## 1.0.87 (2024-02-20)
|
|
51
|
+
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
## 1.0.86 (2024-02-20)
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
## 1.0.85 (2024-02-13)
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
## 1.0.84 (2024-02-13)
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
## 1.0.83 (2024-02-09)
|
|
67
|
+
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
## 1.0.82 (2024-02-05)
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
## 1.0.81 (2024-02-05)
|
|
75
|
+
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
## 1.0.80 (2024-02-05)
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
## 1.0.79 (2024-02-05)
|
|
83
|
+
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
## 1.0.78 (2024-01-30)
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
## 1.0.77 (2024-01-25)
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
## 1.0.76 (2024-01-25)
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
|
|
98
|
+
## 1.0.75 (2024-01-22)
|
|
99
|
+
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
## 1.0.74 (2024-01-22)
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
|
|
106
|
+
## 1.0.73 (2024-01-22)
|
|
107
|
+
|
|
108
|
+
|
|
109
|
+
|
|
110
|
+
## 1.0.72 (2024-01-19)
|
|
111
|
+
|
|
112
|
+
|
|
113
|
+
|
|
114
|
+
## 1.0.71 (2024-01-18)
|
|
115
|
+
|
|
116
|
+
|
|
117
|
+
|
|
118
|
+
## 1.0.70 (2024-01-17)
|
|
119
|
+
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
## 1.0.69 (2024-01-17)
|
|
123
|
+
|
|
124
|
+
|
|
125
|
+
|
|
126
|
+
## 1.0.68 (2024-01-15)
|
|
127
|
+
|
|
128
|
+
|
|
129
|
+
|
|
130
|
+
## 1.0.67 (2024-01-15)
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
## 1.0.66 (2024-01-12)
|
|
135
|
+
|
|
136
|
+
|
|
137
|
+
|
|
138
|
+
## 1.0.65 (2024-01-11)
|
|
139
|
+
|
|
140
|
+
|
|
141
|
+
|
|
142
|
+
## 1.0.64 (2024-01-11)
|
|
143
|
+
|
|
144
|
+
|
|
145
|
+
|
|
146
|
+
## 1.0.63 (2024-01-11)
|
|
147
|
+
|
|
148
|
+
|
|
149
|
+
|
|
150
|
+
## 1.0.62 (2024-01-10)
|
|
151
|
+
|
|
152
|
+
**Note:** Version bump only for package @oanda/labs-currency-power-balance-widget
|
|
153
|
+
|
|
154
|
+
|
|
155
|
+
|
|
156
|
+
|
|
157
|
+
|
|
158
|
+
## 1.0.36 (2024-03-06)
|
|
159
|
+
|
|
160
|
+
|
|
161
|
+
|
|
162
|
+
## 1.0.96 (2024-03-06)
|
|
163
|
+
|
|
164
|
+
|
|
165
|
+
|
|
166
|
+
## 1.0.95 (2024-03-04)
|
|
167
|
+
|
|
168
|
+
|
|
169
|
+
|
|
170
|
+
## 1.0.94 (2024-02-29)
|
|
171
|
+
|
|
172
|
+
|
|
173
|
+
|
|
174
|
+
## 1.0.93 (2024-02-28)
|
|
175
|
+
|
|
176
|
+
|
|
177
|
+
|
|
178
|
+
## 1.0.92 (2024-02-28)
|
|
179
|
+
|
|
180
|
+
|
|
181
|
+
|
|
182
|
+
## 1.0.91 (2024-02-23)
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
|
|
186
|
+
## 1.0.90 (2024-02-23)
|
|
187
|
+
|
|
188
|
+
|
|
189
|
+
|
|
190
|
+
## 1.0.89 (2024-02-21)
|
|
191
|
+
|
|
192
|
+
|
|
193
|
+
|
|
194
|
+
## 1.0.88 (2024-02-21)
|
|
195
|
+
|
|
196
|
+
|
|
197
|
+
|
|
198
|
+
## 1.0.87 (2024-02-20)
|
|
199
|
+
|
|
200
|
+
|
|
201
|
+
|
|
202
|
+
## 1.0.86 (2024-02-20)
|
|
203
|
+
|
|
204
|
+
|
|
205
|
+
|
|
206
|
+
## 1.0.85 (2024-02-13)
|
|
207
|
+
|
|
208
|
+
|
|
209
|
+
|
|
210
|
+
## 1.0.84 (2024-02-13)
|
|
211
|
+
|
|
212
|
+
|
|
213
|
+
|
|
214
|
+
## 1.0.83 (2024-02-09)
|
|
215
|
+
|
|
216
|
+
|
|
217
|
+
|
|
218
|
+
## 1.0.82 (2024-02-05)
|
|
219
|
+
|
|
220
|
+
|
|
221
|
+
|
|
222
|
+
## 1.0.81 (2024-02-05)
|
|
223
|
+
|
|
224
|
+
|
|
225
|
+
|
|
226
|
+
## 1.0.80 (2024-02-05)
|
|
227
|
+
|
|
228
|
+
|
|
229
|
+
|
|
230
|
+
## 1.0.79 (2024-02-05)
|
|
231
|
+
|
|
232
|
+
|
|
233
|
+
|
|
234
|
+
## 1.0.78 (2024-01-30)
|
|
235
|
+
|
|
236
|
+
|
|
237
|
+
|
|
238
|
+
## 1.0.77 (2024-01-25)
|
|
239
|
+
|
|
240
|
+
|
|
241
|
+
|
|
242
|
+
## 1.0.76 (2024-01-25)
|
|
243
|
+
|
|
244
|
+
|
|
245
|
+
|
|
246
|
+
## 1.0.75 (2024-01-22)
|
|
247
|
+
|
|
248
|
+
|
|
249
|
+
|
|
250
|
+
## 1.0.74 (2024-01-22)
|
|
251
|
+
|
|
252
|
+
|
|
253
|
+
|
|
254
|
+
## 1.0.73 (2024-01-22)
|
|
255
|
+
|
|
256
|
+
|
|
257
|
+
|
|
258
|
+
## 1.0.72 (2024-01-19)
|
|
259
|
+
|
|
260
|
+
|
|
261
|
+
|
|
262
|
+
## 1.0.71 (2024-01-18)
|
|
263
|
+
|
|
264
|
+
|
|
265
|
+
|
|
266
|
+
## 1.0.70 (2024-01-17)
|
|
267
|
+
|
|
268
|
+
|
|
269
|
+
|
|
270
|
+
## 1.0.69 (2024-01-17)
|
|
271
|
+
|
|
272
|
+
|
|
273
|
+
|
|
274
|
+
## 1.0.68 (2024-01-15)
|
|
275
|
+
|
|
276
|
+
|
|
277
|
+
|
|
278
|
+
## 1.0.67 (2024-01-15)
|
|
279
|
+
|
|
280
|
+
|
|
281
|
+
|
|
282
|
+
## 1.0.66 (2024-01-12)
|
|
283
|
+
|
|
284
|
+
|
|
285
|
+
|
|
286
|
+
## 1.0.65 (2024-01-11)
|
|
287
|
+
|
|
288
|
+
|
|
289
|
+
|
|
290
|
+
## 1.0.64 (2024-01-11)
|
|
291
|
+
|
|
292
|
+
|
|
293
|
+
|
|
294
|
+
## 1.0.63 (2024-01-11)
|
|
295
|
+
|
|
296
|
+
|
|
297
|
+
|
|
298
|
+
## 1.0.62 (2024-01-10)
|
|
299
|
+
|
|
300
|
+
**Note:** Version bump only for package @oanda/labs-currency-power-balance-widget
|
|
301
|
+
|
|
302
|
+
|
|
303
|
+
|
|
304
|
+
|
|
305
|
+
|
|
6
306
|
## 1.0.35 (2024-03-06)
|
|
7
307
|
|
|
8
308
|
|
|
@@ -39,23 +39,7 @@ const xAxisLabelFormatter = (label, timeUnit) => {
|
|
|
39
39
|
return isDateFormat ? dateFormat(date) : time;
|
|
40
40
|
};
|
|
41
41
|
exports.xAxisLabelFormatter = xAxisLabelFormatter;
|
|
42
|
-
const intervalFormatter = (dataLength
|
|
43
|
-
let offset = 0;
|
|
44
|
-
return isMonthWeek(timeUnit) ? Math.round(dataLength / _constants.VERTICAL_LINE_COUNT) : (index, value) => {
|
|
45
|
-
const everyTwoHours = index % 24 === 0 + offset;
|
|
46
|
-
if (timeUnit === _graphql.CurrencyPowerBalanceTimeUnit.H24 && index === 0) {
|
|
47
|
-
offset = _constants.CANDLE_NUMBER_HOUR - new Date(value).getMinutes() / _constants.CANDLE_MINUTE;
|
|
48
|
-
}
|
|
49
|
-
const hoursIntervalConditions = {
|
|
50
|
-
[_graphql.CurrencyPowerBalanceTimeUnit.H4]: value.endsWith(':00:00Z') || value.endsWith(':30:00Z'),
|
|
51
|
-
[_graphql.CurrencyPowerBalanceTimeUnit.H8]: value.endsWith(':00:00Z') || value.endsWith(':30:00Z'),
|
|
52
|
-
[_graphql.CurrencyPowerBalanceTimeUnit.H24]: everyTwoHours && value.endsWith(':00:00Z'),
|
|
53
|
-
[_graphql.CurrencyPowerBalanceTimeUnit.PreviousDay]: everyTwoHours,
|
|
54
|
-
[_graphql.CurrencyPowerBalanceTimeUnit.CurrentDay]: value.endsWith(':00:00Z')
|
|
55
|
-
};
|
|
56
|
-
return hoursIntervalConditions[timeUnit];
|
|
57
|
-
};
|
|
58
|
-
};
|
|
42
|
+
const intervalFormatter = dataLength => Math.round(dataLength / _constants.VERTICAL_LINE_COUNT);
|
|
59
43
|
exports.intervalFormatter = intervalFormatter;
|
|
60
44
|
const tooltipFormatter = values => {
|
|
61
45
|
const date = dateTimeFormat(getDateAndTime(values[0].value[0]));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formatters.js","names":["_graphql","require","_constants","getDateAndTime","param","dateAndTime","split","date","time","substring","dateFormat","concat","Date","toLocaleDateString","undefined","month","day","dateTimeFormat","_ref","year","isMonthWeek","timeUnit","CurrencyPowerBalanceTimeUnit","M3","M1","W1","exports","xAxisLabelFormatter","label","isDateFormat","intervalFormatter","dataLength","
|
|
1
|
+
{"version":3,"file":"formatters.js","names":["_graphql","require","_constants","getDateAndTime","param","dateAndTime","split","date","time","substring","dateFormat","concat","Date","toLocaleDateString","undefined","month","day","dateTimeFormat","_ref","year","isMonthWeek","timeUnit","CurrencyPowerBalanceTimeUnit","M3","M1","W1","exports","xAxisLabelFormatter","label","isDateFormat","intervalFormatter","dataLength","Math","round","VERTICAL_LINE_COUNT","tooltipFormatter","values","value","row","sort","_ref2","_ref3","valueA","valueB","Number","map","_ref4","marker","seriesName","join"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/formatters.ts"],"sourcesContent":["import { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport { VERTICAL_LINE_COUNT } from './constants';\nimport { TooltipFormatterParams } from './types';\n\nconst getDateAndTime = (param: string) => {\n const dateAndTime = param.split('T');\n\n return {\n date: dateAndTime[0],\n time: dateAndTime[1].substring(0, 5),\n };\n};\n\nconst dateFormat = (date: string) => `${new Date(date).toLocaleDateString(undefined, { month: 'numeric', day: 'numeric' })}`;\n\nconst dateTimeFormat = ({ date, time }: { date: string, time: string }) => `${new Date(date).toLocaleDateString(undefined, { year: 'numeric', month: 'numeric', day: 'numeric' })}, ${time} UTC`;\n\nconst isMonthWeek = (\n timeUnit: CurrencyPowerBalanceTimeUnit,\n) => timeUnit === CurrencyPowerBalanceTimeUnit.M3\n || timeUnit === CurrencyPowerBalanceTimeUnit.M1\n || timeUnit === CurrencyPowerBalanceTimeUnit.W1;\n\nconst xAxisLabelFormatter = (label: string, timeUnit: CurrencyPowerBalanceTimeUnit) => {\n const { date, time } = getDateAndTime(label);\n const isDateFormat = isMonthWeek(timeUnit) || time === '00:00';\n\n return isDateFormat ? dateFormat(date) : time;\n};\n\nconst intervalFormatter = (\n dataLength: number,\n) => Math.round(dataLength / VERTICAL_LINE_COUNT);\n\nconst tooltipFormatter = (values: TooltipFormatterParams[]) => {\n const date = dateTimeFormat(getDateAndTime(values[0].value[0]));\n\n const row = values\n .sort(({ value: valueA }, { value: valueB }) => Number(valueB[1]) - Number(valueA[1]))\n .map(({ marker, seriesName, value }) => `<div style=\"display:flex;align-items:center;\">\n <div style=\"display:flex;align-items:center;width:50px;margin-right:10px;\">\n ${marker}\n <span>${seriesName}</span>\n </div>\n <span>${value[1]}</span>\n </div>`);\n\n return `<div style=\"display:flex; flex-direction:column;\">\n <span style=\"margin-bottom:5px;\">${date}</span>\n ${row.join('\\n')}\n </div>`;\n};\n\nexport {\n isMonthWeek,\n tooltipFormatter,\n xAxisLabelFormatter,\n intervalFormatter,\n};\n"],"mappings":";;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAGA,MAAME,cAAc,GAAIC,KAAa,IAAK;EACxC,MAAMC,WAAW,GAAGD,KAAK,CAACE,KAAK,CAAC,GAAG,CAAC;EAEpC,OAAO;IACLC,IAAI,EAAEF,WAAW,CAAC,CAAC,CAAC;IACpBG,IAAI,EAAEH,WAAW,CAAC,CAAC,CAAC,CAACI,SAAS,CAAC,CAAC,EAAE,CAAC;EACrC,CAAC;AACH,CAAC;AAED,MAAMC,UAAU,GAAIH,IAAY,OAAAI,MAAA,CAAQ,IAAIC,IAAI,CAACL,IAAI,CAAC,CAACM,kBAAkB,CAACC,SAAS,EAAE;EAAEC,KAAK,EAAE,SAAS;EAAEC,GAAG,EAAE;AAAU,CAAC,CAAC,CAAE;AAE5H,MAAMC,cAAc,GAAGC,IAAA;EAAA,IAAC;IAAEX,IAAI;IAAEC;EAAqC,CAAC,GAAAU,IAAA;EAAA,UAAAP,MAAA,CAAQ,IAAIC,IAAI,CAACL,IAAI,CAAC,CAACM,kBAAkB,CAACC,SAAS,EAAE;IAAEK,IAAI,EAAE,SAAS;IAAEJ,KAAK,EAAE,SAAS;IAAEC,GAAG,EAAE;EAAU,CAAC,CAAC,QAAAL,MAAA,CAAKH,IAAI;AAAA,CAAM;AAEhM,MAAMY,WAAW,GACfC,QAAsC,IACnCA,QAAQ,KAAKC,qCAA4B,CAACC,EAAE,IAC5CF,QAAQ,KAAKC,qCAA4B,CAACE,EAAE,IAC5CH,QAAQ,KAAKC,qCAA4B,CAACG,EAAE;AAACC,OAAA,CAAAN,WAAA,GAAAA,WAAA;AAElD,MAAMO,mBAAmB,GAAGA,CAACC,KAAa,EAAEP,QAAsC,KAAK;EACrF,MAAM;IAAEd,IAAI;IAAEC;EAAK,CAAC,GAAGL,cAAc,CAACyB,KAAK,CAAC;EAC5C,MAAMC,YAAY,GAAGT,WAAW,CAACC,QAAQ,CAAC,IAAIb,IAAI,KAAK,OAAO;EAE9D,OAAOqB,YAAY,GAAGnB,UAAU,CAACH,IAAI,CAAC,GAAGC,IAAI;AAC/C,CAAC;AAACkB,OAAA,CAAAC,mBAAA,GAAAA,mBAAA;AAEF,MAAMG,iBAAiB,GACrBC,UAAkB,IACfC,IAAI,CAACC,KAAK,CAACF,UAAU,GAAGG,8BAAmB,CAAC;AAACR,OAAA,CAAAI,iBAAA,GAAAA,iBAAA;AAElD,MAAMK,gBAAgB,GAAIC,MAAgC,IAAK;EAC7D,MAAM7B,IAAI,GAAGU,cAAc,CAACd,cAAc,CAACiC,MAAM,CAAC,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;EAE/D,MAAMC,GAAG,GAAGF,MAAM,CACfG,IAAI,CAAC,CAAAC,KAAA,EAAAC,KAAA;IAAA,IAAC;MAAEJ,KAAK,EAAEK;IAAO,CAAC,GAAAF,KAAA;IAAA,IAAE;MAAEH,KAAK,EAAEM;IAAO,CAAC,GAAAF,KAAA;IAAA,OAAKG,MAAM,CAACD,MAAM,CAAC,CAAC,CAAC,CAAC,GAAGC,MAAM,CAACF,MAAM,CAAC,CAAC,CAAC,CAAC;EAAA,EAAC,CACrFG,GAAG,CAACC,KAAA;IAAA,IAAC;MAAEC,MAAM;MAAEC,UAAU;MAAEX;IAAM,CAAC,GAAAS,KAAA;IAAA,yJAAAnC,MAAA,CAE7BoC,MAAM,sBAAApC,MAAA,CACAqC,UAAU,yCAAArC,MAAA,CAEZ0B,KAAK,CAAC,CAAC,CAAC;EAAA,CACX,CAAC;EAEV,uGAAA1B,MAAA,CACqCJ,IAAI,mBAAAI,MAAA,CACrC2B,GAAG,CAACW,IAAI,CAAC,IAAI,CAAC;AAEpB,CAAC;AAACvB,OAAA,CAAAS,gBAAA,GAAAA,gBAAA","ignoreList":[]}
|
|
@@ -73,7 +73,7 @@ const getOption = (values, timeUnit, isDark) => {
|
|
|
73
73
|
align: 'left',
|
|
74
74
|
margin: 10,
|
|
75
75
|
rotate: -45,
|
|
76
|
-
interval: (0, _formatters.intervalFormatter)(seriesData[0].data.length
|
|
76
|
+
interval: (0, _formatters.intervalFormatter)(seriesData[0].data.length),
|
|
77
77
|
formatter: label => (0, _formatters.xAxisLabelFormatter)(label, timeUnit)
|
|
78
78
|
}
|
|
79
79
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOption.js","names":["_constants","require","_formatters","getOption","values","timeUnit","isDark","seriesData","map","_ref","currency","power","name","type","symbol","showSymbol","itemStyle","color","COLOR_CONFIG","lineStyle","data","_ref2","point","price","legendData","Object","keys","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","TOOLTIP_LINE_COLOR_CONFIG","DARK","LIGHT","formatter","tooltipFormatter","extraCssText","xAxis","axisTick","show","axisLine","splitLine","axisLabel","padding","align","margin","rotate","interval","intervalFormatter","length","label","xAxisLabelFormatter","yAxis","position","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series","exports"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { COLOR_CONFIG, TOOLTIP_LINE_COLOR_CONFIG } from './constants';\nimport { intervalFormatter, tooltipFormatter, xAxisLabelFormatter } from './formatters';\nimport { CurrencyPowerBalance, CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\n\nconst getOption = (\n values: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n) => {\n const seriesData = values.map(({ currency, power }) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n lineStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n }));\n\n const legendData = Object.keys(COLOR_CONFIG).map((currency) => ({\n name: currency,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n }));\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark ? TOOLTIP_LINE_COLOR_CONFIG.DARK : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length
|
|
1
|
+
{"version":3,"file":"getOption.js","names":["_constants","require","_formatters","getOption","values","timeUnit","isDark","seriesData","map","_ref","currency","power","name","type","symbol","showSymbol","itemStyle","color","COLOR_CONFIG","lineStyle","data","_ref2","point","price","legendData","Object","keys","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","TOOLTIP_LINE_COLOR_CONFIG","DARK","LIGHT","formatter","tooltipFormatter","extraCssText","xAxis","axisTick","show","axisLine","splitLine","axisLabel","padding","align","margin","rotate","interval","intervalFormatter","length","label","xAxisLabelFormatter","yAxis","position","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series","exports"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { COLOR_CONFIG, TOOLTIP_LINE_COLOR_CONFIG } from './constants';\nimport { intervalFormatter, tooltipFormatter, xAxisLabelFormatter } from './formatters';\nimport { CurrencyPowerBalance, CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\n\nconst getOption = (\n values: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n) => {\n const seriesData = values.map(({ currency, power }) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n lineStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n }));\n\n const legendData = Object.keys(COLOR_CONFIG).map((currency) => ({\n name: currency,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n }));\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark ? TOOLTIP_LINE_COLOR_CONFIG.DARK : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length),\n formatter: (label: string) => xAxisLabelFormatter(label, timeUnit),\n },\n },\n yAxis: {\n type: 'value',\n position: 'right',\n splitNumber: 5,\n axisLine: { show: false },\n axisTick: { show: false },\n boundaryGap: ['10%', '10%'],\n axisLabel: {\n showMaxLabel: false,\n showMinLabel: false,\n },\n },\n series: seriesData,\n };\n};\n\nexport { getOption };\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAGA,MAAME,SAAS,GAAGA,CAChBC,MAA8B,EAC9BC,QAAsC,EACtCC,MAAe,KACZ;EACH,MAAMC,UAAU,GAAGH,MAAM,CAACI,GAAG,CAACC,IAAA;IAAA,IAAC;MAAEC,QAAQ;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAAA,OAAM;MACtDG,IAAI,EAAEF,QAAQ;MACdG,IAAI,EAAE,MAAM;MACZC,MAAM,EAAE,QAAQ;MAChBC,UAAU,EAAE,KAAK;MACjBC,SAAS,EAAE;QACTC,KAAK,EAAEC,uBAAY,CAACR,QAAQ;MAC9B,CAAC;MACDS,SAAS,EAAE;QACTF,KAAK,EAAEC,uBAAY,CAACR,QAAQ;MAC9B,CAAC;MACDU,IAAI,EAAET,KAAK,CAACH,GAAG,CAACa,KAAA;QAAA,IAAC;UAAEC,KAAK;UAAEC;QAAM,CAAC,GAAAF,KAAA;QAAA,OAAK,CAACC,KAAK,EAAEC,KAAK,CAAC;MAAA;IACtD,CAAC;EAAA,CAAC,CAAC;EAEH,MAAMC,UAAU,GAAGC,MAAM,CAACC,IAAI,CAACR,uBAAY,CAAC,CAACV,GAAG,CAAEE,QAAQ,KAAM;IAC9DE,IAAI,EAAEF,QAAQ;IACdM,SAAS,EAAE;MACTC,KAAK,EAAEC,uBAAY,CAACR,QAAQ;IAC9B;EACF,CAAC,CAAC,CAAC;EAEH,OAAO;IACLiB,SAAS,EAAE,KAAK;IAChBC,MAAM,EAAE;MACNR,IAAI,EAAEI,UAAU;MAChBK,MAAM,EAAE,EAAE;MACVC,IAAI,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACPC,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;QACXC,IAAI,EAAE,GAAG;QACTC,CAAC,EAAE,CAAC;QACJhB,SAAS,EAAE;UACTF,KAAK,EAAEX,MAAM,GAAG8B,oCAAyB,CAACC,IAAI,GAAGD,oCAAyB,CAACE;QAC7E;MACF,CAAC;MACDC,SAAS,EAAEC,4BAAgB;MAC3BC,YAAY,EAAE;IAChB,CAAC;IACDC,KAAK,EAAE;MACL7B,IAAI,EAAE,UAAU;MAChB8B,QAAQ,EAAE;QACRC,IAAI,EAAE;MACR,CAAC;MACDC,QAAQ,EAAE;QAAED,IAAI,EAAE;MAAM,CAAC;MACzBE,SAAS,EAAE;QACTF,IAAI,EAAE;MACR,CAAC;MACDG,SAAS,EAAE;QACTC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrBC,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,EAAE;QACVC,MAAM,EAAE,CAAC,EAAE;QACXC,QAAQ,EAAE,IAAAC,6BAAiB,EAAC9C,UAAU,CAAC,CAAC,CAAC,CAACa,IAAI,CAACkC,MAAM,CAAC;QACtDf,SAAS,EAAGgB,KAAa,IAAK,IAAAC,+BAAmB,EAACD,KAAK,EAAElD,QAAQ;MACnE;IACF,CAAC;IACDoD,KAAK,EAAE;MACL5C,IAAI,EAAE,OAAO;MACb6C,QAAQ,EAAE,OAAO;MACjBC,WAAW,EAAE,CAAC;MACdd,QAAQ,EAAE;QAAED,IAAI,EAAE;MAAM,CAAC;MACzBD,QAAQ,EAAE;QAAEC,IAAI,EAAE;MAAM,CAAC;MACzBgB,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC;MAC3Bb,SAAS,EAAE;QACTc,YAAY,EAAE,KAAK;QACnBC,YAAY,EAAE;MAChB;IACF,CAAC;IACDC,MAAM,EAAExD;EACV,CAAC;AACH,CAAC;AAACyD,OAAA,CAAA7D,SAAA,GAAAA,SAAA","ignoreList":[]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';
|
|
2
|
-
import {
|
|
2
|
+
import { VERTICAL_LINE_COUNT } from './constants';
|
|
3
3
|
const getDateAndTime = param => {
|
|
4
4
|
const dateAndTime = param.split('T');
|
|
5
5
|
return {
|
|
@@ -31,23 +31,7 @@ const xAxisLabelFormatter = (label, timeUnit) => {
|
|
|
31
31
|
const isDateFormat = isMonthWeek(timeUnit) || time === '00:00';
|
|
32
32
|
return isDateFormat ? dateFormat(date) : time;
|
|
33
33
|
};
|
|
34
|
-
const intervalFormatter = (dataLength
|
|
35
|
-
let offset = 0;
|
|
36
|
-
return isMonthWeek(timeUnit) ? Math.round(dataLength / VERTICAL_LINE_COUNT) : (index, value) => {
|
|
37
|
-
const everyTwoHours = index % 24 === 0 + offset;
|
|
38
|
-
if (timeUnit === CurrencyPowerBalanceTimeUnit.H24 && index === 0) {
|
|
39
|
-
offset = CANDLE_NUMBER_HOUR - new Date(value).getMinutes() / CANDLE_MINUTE;
|
|
40
|
-
}
|
|
41
|
-
const hoursIntervalConditions = {
|
|
42
|
-
[CurrencyPowerBalanceTimeUnit.H4]: value.endsWith(':00:00Z') || value.endsWith(':30:00Z'),
|
|
43
|
-
[CurrencyPowerBalanceTimeUnit.H8]: value.endsWith(':00:00Z') || value.endsWith(':30:00Z'),
|
|
44
|
-
[CurrencyPowerBalanceTimeUnit.H24]: everyTwoHours && value.endsWith(':00:00Z'),
|
|
45
|
-
[CurrencyPowerBalanceTimeUnit.PreviousDay]: everyTwoHours,
|
|
46
|
-
[CurrencyPowerBalanceTimeUnit.CurrentDay]: value.endsWith(':00:00Z')
|
|
47
|
-
};
|
|
48
|
-
return hoursIntervalConditions[timeUnit];
|
|
49
|
-
};
|
|
50
|
-
};
|
|
34
|
+
const intervalFormatter = dataLength => Math.round(dataLength / VERTICAL_LINE_COUNT);
|
|
51
35
|
const tooltipFormatter = values => {
|
|
52
36
|
const date = dateTimeFormat(getDateAndTime(values[0].value[0]));
|
|
53
37
|
const row = values.sort((_ref2, _ref3) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formatters.js","names":["CurrencyPowerBalanceTimeUnit","
|
|
1
|
+
{"version":3,"file":"formatters.js","names":["CurrencyPowerBalanceTimeUnit","VERTICAL_LINE_COUNT","getDateAndTime","param","dateAndTime","split","date","time","substring","dateFormat","concat","Date","toLocaleDateString","undefined","month","day","dateTimeFormat","_ref","year","isMonthWeek","timeUnit","M3","M1","W1","xAxisLabelFormatter","label","isDateFormat","intervalFormatter","dataLength","Math","round","tooltipFormatter","values","value","row","sort","_ref2","_ref3","valueA","valueB","Number","map","_ref4","marker","seriesName","join"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/formatters.ts"],"sourcesContent":["import { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport { VERTICAL_LINE_COUNT } from './constants';\nimport { TooltipFormatterParams } from './types';\n\nconst getDateAndTime = (param: string) => {\n const dateAndTime = param.split('T');\n\n return {\n date: dateAndTime[0],\n time: dateAndTime[1].substring(0, 5),\n };\n};\n\nconst dateFormat = (date: string) => `${new Date(date).toLocaleDateString(undefined, { month: 'numeric', day: 'numeric' })}`;\n\nconst dateTimeFormat = ({ date, time }: { date: string, time: string }) => `${new Date(date).toLocaleDateString(undefined, { year: 'numeric', month: 'numeric', day: 'numeric' })}, ${time} UTC`;\n\nconst isMonthWeek = (\n timeUnit: CurrencyPowerBalanceTimeUnit,\n) => timeUnit === CurrencyPowerBalanceTimeUnit.M3\n || timeUnit === CurrencyPowerBalanceTimeUnit.M1\n || timeUnit === CurrencyPowerBalanceTimeUnit.W1;\n\nconst xAxisLabelFormatter = (label: string, timeUnit: CurrencyPowerBalanceTimeUnit) => {\n const { date, time } = getDateAndTime(label);\n const isDateFormat = isMonthWeek(timeUnit) || time === '00:00';\n\n return isDateFormat ? dateFormat(date) : time;\n};\n\nconst intervalFormatter = (\n dataLength: number,\n) => Math.round(dataLength / VERTICAL_LINE_COUNT);\n\nconst tooltipFormatter = (values: TooltipFormatterParams[]) => {\n const date = dateTimeFormat(getDateAndTime(values[0].value[0]));\n\n const row = values\n .sort(({ value: valueA }, { value: valueB }) => Number(valueB[1]) - Number(valueA[1]))\n .map(({ marker, seriesName, value }) => `<div style=\"display:flex;align-items:center;\">\n <div style=\"display:flex;align-items:center;width:50px;margin-right:10px;\">\n ${marker}\n <span>${seriesName}</span>\n </div>\n <span>${value[1]}</span>\n </div>`);\n\n return `<div style=\"display:flex; flex-direction:column;\">\n <span style=\"margin-bottom:5px;\">${date}</span>\n ${row.join('\\n')}\n </div>`;\n};\n\nexport {\n isMonthWeek,\n tooltipFormatter,\n xAxisLabelFormatter,\n intervalFormatter,\n};\n"],"mappings":"AAAA,SAASA,4BAA4B,QAAQ,+BAA+B;AAC5E,SAASC,mBAAmB,QAAQ,aAAa;AAGjD,MAAMC,cAAc,GAAIC,KAAa,IAAK;EACxC,MAAMC,WAAW,GAAGD,KAAK,CAACE,KAAK,CAAC,GAAG,CAAC;EAEpC,OAAO;IACLC,IAAI,EAAEF,WAAW,CAAC,CAAC,CAAC;IACpBG,IAAI,EAAEH,WAAW,CAAC,CAAC,CAAC,CAACI,SAAS,CAAC,CAAC,EAAE,CAAC;EACrC,CAAC;AACH,CAAC;AAED,MAAMC,UAAU,GAAIH,IAAY,OAAAI,MAAA,CAAQ,IAAIC,IAAI,CAACL,IAAI,CAAC,CAACM,kBAAkB,CAACC,SAAS,EAAE;EAAEC,KAAK,EAAE,SAAS;EAAEC,GAAG,EAAE;AAAU,CAAC,CAAC,CAAE;AAE5H,MAAMC,cAAc,GAAGC,IAAA;EAAA,IAAC;IAAEX,IAAI;IAAEC;EAAqC,CAAC,GAAAU,IAAA;EAAA,UAAAP,MAAA,CAAQ,IAAIC,IAAI,CAACL,IAAI,CAAC,CAACM,kBAAkB,CAACC,SAAS,EAAE;IAAEK,IAAI,EAAE,SAAS;IAAEJ,KAAK,EAAE,SAAS;IAAEC,GAAG,EAAE;EAAU,CAAC,CAAC,QAAAL,MAAA,CAAKH,IAAI;AAAA,CAAM;AAEhM,MAAMY,WAAW,GACfC,QAAsC,IACnCA,QAAQ,KAAKpB,4BAA4B,CAACqB,EAAE,IAC5CD,QAAQ,KAAKpB,4BAA4B,CAACsB,EAAE,IAC5CF,QAAQ,KAAKpB,4BAA4B,CAACuB,EAAE;AAEjD,MAAMC,mBAAmB,GAAGA,CAACC,KAAa,EAAEL,QAAsC,KAAK;EACrF,MAAM;IAAEd,IAAI;IAAEC;EAAK,CAAC,GAAGL,cAAc,CAACuB,KAAK,CAAC;EAC5C,MAAMC,YAAY,GAAGP,WAAW,CAACC,QAAQ,CAAC,IAAIb,IAAI,KAAK,OAAO;EAE9D,OAAOmB,YAAY,GAAGjB,UAAU,CAACH,IAAI,CAAC,GAAGC,IAAI;AAC/C,CAAC;AAED,MAAMoB,iBAAiB,GACrBC,UAAkB,IACfC,IAAI,CAACC,KAAK,CAACF,UAAU,GAAG3B,mBAAmB,CAAC;AAEjD,MAAM8B,gBAAgB,GAAIC,MAAgC,IAAK;EAC7D,MAAM1B,IAAI,GAAGU,cAAc,CAACd,cAAc,CAAC8B,MAAM,CAAC,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;EAE/D,MAAMC,GAAG,GAAGF,MAAM,CACfG,IAAI,CAAC,CAAAC,KAAA,EAAAC,KAAA;IAAA,IAAC;MAAEJ,KAAK,EAAEK;IAAO,CAAC,GAAAF,KAAA;IAAA,IAAE;MAAEH,KAAK,EAAEM;IAAO,CAAC,GAAAF,KAAA;IAAA,OAAKG,MAAM,CAACD,MAAM,CAAC,CAAC,CAAC,CAAC,GAAGC,MAAM,CAACF,MAAM,CAAC,CAAC,CAAC,CAAC;EAAA,EAAC,CACrFG,GAAG,CAACC,KAAA;IAAA,IAAC;MAAEC,MAAM;MAAEC,UAAU;MAAEX;IAAM,CAAC,GAAAS,KAAA;IAAA,yJAAAhC,MAAA,CAE7BiC,MAAM,sBAAAjC,MAAA,CACAkC,UAAU,yCAAAlC,MAAA,CAEZuB,KAAK,CAAC,CAAC,CAAC;EAAA,CACX,CAAC;EAEV,uGAAAvB,MAAA,CACqCJ,IAAI,mBAAAI,MAAA,CACrCwB,GAAG,CAACW,IAAI,CAAC,IAAI,CAAC;AAEpB,CAAC;AAED,SACE1B,WAAW,EACXY,gBAAgB,EAChBP,mBAAmB,EACnBG,iBAAiB","ignoreList":[]}
|
|
@@ -67,7 +67,7 @@ const getOption = (values, timeUnit, isDark) => {
|
|
|
67
67
|
align: 'left',
|
|
68
68
|
margin: 10,
|
|
69
69
|
rotate: -45,
|
|
70
|
-
interval: intervalFormatter(seriesData[0].data.length
|
|
70
|
+
interval: intervalFormatter(seriesData[0].data.length),
|
|
71
71
|
formatter: label => xAxisLabelFormatter(label, timeUnit)
|
|
72
72
|
}
|
|
73
73
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOption.js","names":["COLOR_CONFIG","TOOLTIP_LINE_COLOR_CONFIG","intervalFormatter","tooltipFormatter","xAxisLabelFormatter","getOption","values","timeUnit","isDark","seriesData","map","_ref","currency","power","name","type","symbol","showSymbol","itemStyle","color","lineStyle","data","_ref2","point","price","legendData","Object","keys","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","DARK","LIGHT","formatter","extraCssText","xAxis","axisTick","show","axisLine","splitLine","axisLabel","padding","align","margin","rotate","interval","length","label","yAxis","position","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { COLOR_CONFIG, TOOLTIP_LINE_COLOR_CONFIG } from './constants';\nimport { intervalFormatter, tooltipFormatter, xAxisLabelFormatter } from './formatters';\nimport { CurrencyPowerBalance, CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\n\nconst getOption = (\n values: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n) => {\n const seriesData = values.map(({ currency, power }) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n lineStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n }));\n\n const legendData = Object.keys(COLOR_CONFIG).map((currency) => ({\n name: currency,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n }));\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark ? TOOLTIP_LINE_COLOR_CONFIG.DARK : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length
|
|
1
|
+
{"version":3,"file":"getOption.js","names":["COLOR_CONFIG","TOOLTIP_LINE_COLOR_CONFIG","intervalFormatter","tooltipFormatter","xAxisLabelFormatter","getOption","values","timeUnit","isDark","seriesData","map","_ref","currency","power","name","type","symbol","showSymbol","itemStyle","color","lineStyle","data","_ref2","point","price","legendData","Object","keys","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","DARK","LIGHT","formatter","extraCssText","xAxis","axisTick","show","axisLine","splitLine","axisLabel","padding","align","margin","rotate","interval","length","label","yAxis","position","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { COLOR_CONFIG, TOOLTIP_LINE_COLOR_CONFIG } from './constants';\nimport { intervalFormatter, tooltipFormatter, xAxisLabelFormatter } from './formatters';\nimport { CurrencyPowerBalance, CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\n\nconst getOption = (\n values: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n) => {\n const seriesData = values.map(({ currency, power }) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n lineStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n }));\n\n const legendData = Object.keys(COLOR_CONFIG).map((currency) => ({\n name: currency,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n }));\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark ? TOOLTIP_LINE_COLOR_CONFIG.DARK : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length),\n formatter: (label: string) => xAxisLabelFormatter(label, timeUnit),\n },\n },\n yAxis: {\n type: 'value',\n position: 'right',\n splitNumber: 5,\n axisLine: { show: false },\n axisTick: { show: false },\n boundaryGap: ['10%', '10%'],\n axisLabel: {\n showMaxLabel: false,\n showMinLabel: false,\n },\n },\n series: seriesData,\n };\n};\n\nexport { getOption };\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,yBAAyB,QAAQ,aAAa;AACrE,SAASC,iBAAiB,EAAEC,gBAAgB,EAAEC,mBAAmB,QAAQ,cAAc;AAGvF,MAAMC,SAAS,GAAGA,CAChBC,MAA8B,EAC9BC,QAAsC,EACtCC,MAAe,KACZ;EACH,MAAMC,UAAU,GAAGH,MAAM,CAACI,GAAG,CAACC,IAAA;IAAA,IAAC;MAAEC,QAAQ;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAAA,OAAM;MACtDG,IAAI,EAAEF,QAAQ;MACdG,IAAI,EAAE,MAAM;MACZC,MAAM,EAAE,QAAQ;MAChBC,UAAU,EAAE,KAAK;MACjBC,SAAS,EAAE;QACTC,KAAK,EAAEnB,YAAY,CAACY,QAAQ;MAC9B,CAAC;MACDQ,SAAS,EAAE;QACTD,KAAK,EAAEnB,YAAY,CAACY,QAAQ;MAC9B,CAAC;MACDS,IAAI,EAAER,KAAK,CAACH,GAAG,CAACY,KAAA;QAAA,IAAC;UAAEC,KAAK;UAAEC;QAAM,CAAC,GAAAF,KAAA;QAAA,OAAK,CAACC,KAAK,EAAEC,KAAK,CAAC;MAAA;IACtD,CAAC;EAAA,CAAC,CAAC;EAEH,MAAMC,UAAU,GAAGC,MAAM,CAACC,IAAI,CAAC3B,YAAY,CAAC,CAACU,GAAG,CAAEE,QAAQ,KAAM;IAC9DE,IAAI,EAAEF,QAAQ;IACdM,SAAS,EAAE;MACTC,KAAK,EAAEnB,YAAY,CAACY,QAAQ;IAC9B;EACF,CAAC,CAAC,CAAC;EAEH,OAAO;IACLgB,SAAS,EAAE,KAAK;IAChBC,MAAM,EAAE;MACNR,IAAI,EAAEI,UAAU;MAChBK,MAAM,EAAE,EAAE;MACVC,IAAI,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACPC,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;QACXC,IAAI,EAAE,GAAG;QACTC,CAAC,EAAE,CAAC;QACJhB,SAAS,EAAE;UACTD,KAAK,EAAEX,MAAM,GAAGP,yBAAyB,CAACoC,IAAI,GAAGpC,yBAAyB,CAACqC;QAC7E;MACF,CAAC;MACDC,SAAS,EAAEpC,gBAAgB;MAC3BqC,YAAY,EAAE;IAChB,CAAC;IACDC,KAAK,EAAE;MACL1B,IAAI,EAAE,UAAU;MAChB2B,QAAQ,EAAE;QACRC,IAAI,EAAE;MACR,CAAC;MACDC,QAAQ,EAAE;QAAED,IAAI,EAAE;MAAM,CAAC;MACzBE,SAAS,EAAE;QACTF,IAAI,EAAE;MACR,CAAC;MACDG,SAAS,EAAE;QACTC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrBC,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,EAAE;QACVC,MAAM,EAAE,CAAC,EAAE;QACXC,QAAQ,EAAEjD,iBAAiB,CAACO,UAAU,CAAC,CAAC,CAAC,CAACY,IAAI,CAAC+B,MAAM,CAAC;QACtDb,SAAS,EAAGc,KAAa,IAAKjD,mBAAmB,CAACiD,KAAK,EAAE9C,QAAQ;MACnE;IACF,CAAC;IACD+C,KAAK,EAAE;MACLvC,IAAI,EAAE,OAAO;MACbwC,QAAQ,EAAE,OAAO;MACjBC,WAAW,EAAE,CAAC;MACdZ,QAAQ,EAAE;QAAED,IAAI,EAAE;MAAM,CAAC;MACzBD,QAAQ,EAAE;QAAEC,IAAI,EAAE;MAAM,CAAC;MACzBc,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC;MAC3BX,SAAS,EAAE;QACTY,YAAY,EAAE,KAAK;QACnBC,YAAY,EAAE;MAChB;IACF,CAAC;IACDC,MAAM,EAAEnD;EACV,CAAC;AACH,CAAC;AAED,SAASJ,SAAS","ignoreList":[]}
|
|
@@ -2,6 +2,6 @@ import { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';
|
|
|
2
2
|
import { TooltipFormatterParams } from './types';
|
|
3
3
|
declare const isMonthWeek: (timeUnit: CurrencyPowerBalanceTimeUnit) => boolean;
|
|
4
4
|
declare const xAxisLabelFormatter: (label: string, timeUnit: CurrencyPowerBalanceTimeUnit) => string;
|
|
5
|
-
declare const intervalFormatter: (dataLength: number
|
|
5
|
+
declare const intervalFormatter: (dataLength: number) => number;
|
|
6
6
|
declare const tooltipFormatter: (values: TooltipFormatterParams[]) => string;
|
|
7
7
|
export { isMonthWeek, tooltipFormatter, xAxisLabelFormatter, intervalFormatter, };
|
|
@@ -39,7 +39,7 @@ declare const getOption: (values: CurrencyPowerBalance[], timeUnit: CurrencyPowe
|
|
|
39
39
|
align: string;
|
|
40
40
|
margin: number;
|
|
41
41
|
rotate: number;
|
|
42
|
-
interval: number
|
|
42
|
+
interval: number;
|
|
43
43
|
formatter: (label: string) => string;
|
|
44
44
|
};
|
|
45
45
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oanda/labs-currency-power-balance-widget",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.37",
|
|
4
4
|
"description": "Labs Currency Power Balance Widget",
|
|
5
5
|
"main": "dist/main/index.js",
|
|
6
6
|
"module": "dist/module/index.js",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"license": "UNLICENSED",
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@apollo/client": "3.7.17",
|
|
16
|
-
"@oanda/labs-widget-common": "^1.0.
|
|
16
|
+
"@oanda/labs-widget-common": "^1.0.98",
|
|
17
17
|
"@oanda/mono-i18n": "9.0.0",
|
|
18
18
|
"echarts": "5.5.0",
|
|
19
19
|
"echarts-for-react": "3.0.2",
|
|
@@ -23,5 +23,5 @@
|
|
|
23
23
|
"@graphql-codegen/cli": "5.0.0",
|
|
24
24
|
"@graphql-codegen/client-preset": "4.1.0"
|
|
25
25
|
},
|
|
26
|
-
"gitHead": "
|
|
26
|
+
"gitHead": "6122902e4027d79f8317c4f1a201adb0279f2b6d"
|
|
27
27
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';
|
|
2
|
-
import {
|
|
2
|
+
import { VERTICAL_LINE_COUNT } from './constants';
|
|
3
3
|
import { TooltipFormatterParams } from './types';
|
|
4
4
|
|
|
5
5
|
const getDateAndTime = (param: string) => {
|
|
@@ -30,30 +30,7 @@ const xAxisLabelFormatter = (label: string, timeUnit: CurrencyPowerBalanceTimeUn
|
|
|
30
30
|
|
|
31
31
|
const intervalFormatter = (
|
|
32
32
|
dataLength: number,
|
|
33
|
-
|
|
34
|
-
) => {
|
|
35
|
-
let offset = 0;
|
|
36
|
-
|
|
37
|
-
return isMonthWeek(timeUnit)
|
|
38
|
-
? Math.round(dataLength / VERTICAL_LINE_COUNT)
|
|
39
|
-
: (index: number, value: string) => {
|
|
40
|
-
const everyTwoHours = index % 24 === 0 + offset;
|
|
41
|
-
|
|
42
|
-
if (timeUnit === CurrencyPowerBalanceTimeUnit.H24 && index === 0) {
|
|
43
|
-
offset = CANDLE_NUMBER_HOUR - new Date(value).getMinutes() / CANDLE_MINUTE;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
const hoursIntervalConditions: Record<string, boolean> = {
|
|
47
|
-
[CurrencyPowerBalanceTimeUnit.H4]: value.endsWith(':00:00Z') || value.endsWith(':30:00Z'),
|
|
48
|
-
[CurrencyPowerBalanceTimeUnit.H8]: value.endsWith(':00:00Z') || value.endsWith(':30:00Z'),
|
|
49
|
-
[CurrencyPowerBalanceTimeUnit.H24]: everyTwoHours && value.endsWith(':00:00Z'),
|
|
50
|
-
[CurrencyPowerBalanceTimeUnit.PreviousDay]: everyTwoHours,
|
|
51
|
-
[CurrencyPowerBalanceTimeUnit.CurrentDay]: value.endsWith(':00:00Z'),
|
|
52
|
-
};
|
|
53
|
-
|
|
54
|
-
return hoursIntervalConditions[timeUnit];
|
|
55
|
-
};
|
|
56
|
-
};
|
|
33
|
+
) => Math.round(dataLength / VERTICAL_LINE_COUNT);
|
|
57
34
|
|
|
58
35
|
const tooltipFormatter = (values: TooltipFormatterParams[]) => {
|
|
59
36
|
const date = dateTimeFormat(getDateAndTime(values[0].value[0]));
|
|
@@ -61,7 +61,7 @@ const getOption = (
|
|
|
61
61
|
align: 'left',
|
|
62
62
|
margin: 10,
|
|
63
63
|
rotate: -45,
|
|
64
|
-
interval: intervalFormatter(seriesData[0].data.length
|
|
64
|
+
interval: intervalFormatter(seriesData[0].data.length),
|
|
65
65
|
formatter: (label: string) => xAxisLabelFormatter(label, timeUnit),
|
|
66
66
|
},
|
|
67
67
|
},
|
|
@@ -7,10 +7,10 @@ import { CurrencyPowerBalanceTimeUnit } from '../src/gql/types/graphql';
|
|
|
7
7
|
|
|
8
8
|
describe('intervalFormatter', () => {
|
|
9
9
|
it('should return number of intervals for timeUnit equal to 3 months', () => {
|
|
10
|
-
expect(intervalFormatter(30
|
|
10
|
+
expect(intervalFormatter(30)).toEqual(3);
|
|
11
11
|
});
|
|
12
|
-
it('should return function timeUnit equal to 24 hours', () => {
|
|
13
|
-
expect(intervalFormatter(30
|
|
12
|
+
it.skip('should return function timeUnit equal to 24 hours', () => {
|
|
13
|
+
expect(intervalFormatter(30)).toEqual(expect.any(Function));
|
|
14
14
|
});
|
|
15
15
|
});
|
|
16
16
|
|