@candleview/core 2.9.3 → 2.9.5

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.
Files changed (5) hide show
  1. package/README.md +756 -0
  2. package/dist/index.d.ts +245 -15
  3. package/dist/index.js +165 -163
  4. package/dist/index.mjs +2565 -1808
  5. package/package.json +1 -1
package/README.md ADDED
@@ -0,0 +1,756 @@
1
+ <p align="center">
2
+ <picture>
3
+ <source media="(prefers-color-scheme: dark)" srcset="../assets/logo/logo_imgtxt_dark_en.png">
4
+ <source media="(prefers-color-scheme: light)" srcset="../assets/logo/logo_imgtxt_light_en.png">
5
+ <img src="../assets/logo/logo_imgtxt_light_en.png" alt="Portal" width="300">
6
+ </picture>
7
+ </p>
8
+ <h4 align="center">
9
+ A time-series data visualization and charting engine designed specifically for the financial industry.
10
+ </h4>
11
+ <p align="center">
12
+ <a href="https://github.com/0xhappyboy/candleview/blob/main/LICENSE"><img src="https://img.shields.io/badge/License-AGPL3.0-d1d1f6.svg?style=flat&labelColor=1C2C2E&color=BEC5C9&logo=googledocs&label=license&logoColor=BEC5C9" alt="License"></a>
13
+ <a href="https://www.typescriptlang.org/"><img src="https://img.shields.io/badge/TypeScript-5.0+-3178C6.svg?style=flat&labelColor=1C2C2E&color=007ACC&logo=typescript&logoColor=white" alt="TypeScript"></a>
14
+ <a href="https://github.com/0xhappyboy/candleview/stargazers"><img src="https://img.shields.io/github/stars/0xhappyboy/candleview.svg?style=flat&labelColor=1C2C2E&color=FFD700&logo=github&logoColor=white&label=stars" alt="GitHub stars"></a>
15
+ <a href="https://github.com/0xhappyboy/candleview/issues"><img src="https://img.shields.io/github/issues/0xhappyboy/candleview.svg?style=flat&labelColor=1C2C2E&color=FF6B6B&logo=github&logoColor=white&label=issues" alt="GitHub issues"></a>
16
+ <a href="https://github.com/0xhappyboy/candleview/network/members"><img src="https://img.shields.io/github/forks/0xhappyboy/candleview.svg?style=flat&labelColor=1C2C2E&color=42A5F5&logo=github&logoColor=white&label=forks" alt="GitHub forks"></a>
17
+ <a href="https://www.npmjs.com/package/@candleview/core"><img src="https://img.shields.io/npm/v/candleview.svg?style=flat&labelColor=1C2C2E&color=FF5722&logo=npm&logoColor=white&label=npm%20version" alt="npm version"></a>
18
+ <a href="https://github.com/0xhappyboy/candleview/releases"><img src="https://img.shields.io/github/v/tag/0xhappyboy/candleview.svg?style=flat&labelColor=1C2C2E&color=9C27B0&logo=github&logoColor=white&label=latest%20release" alt="GitHub release"></a>
19
+ <a href="https://github.com/0xhappyboy/candleview/actions"><img src="https://img.shields.io/github/actions/workflow/status/0xhappyboy/candleview/release.yml?style=flat&labelColor=1C2C2E&color=4CAF50&logo=githubactions&logoColor=white&label=build" alt="Build Status"></a><a href="https://www.npmjs.com/package/@candleview/core"><img src="https://img.shields.io/npm/dt/candleview?style=flat&labelColor=1C2C2E&color=00BCD4&logo=npm&logoColor=white&label=total%20downloads" alt="npm downloads"></a>
20
+ <a href="https://www.npmjs.com/package/@candleview/core"><img src="https://img.shields.io/npm/dm/candleview?style=flat&labelColor=1C2C2E&color=00BCD4&logo=npm&logoColor=white&label=downloads/month" alt="npm downloads"></a>
21
+ <a href="https://www.npmjs.com/package/@candleview/core"><img src="https://img.shields.io/npm/dw/candleview?style=flat&labelColor=1C2C2E&color=00BCD4&logo=npm&logoColor=white&label=downloads/week" alt="npm downloads"></a>
22
+ <a href="https://twitter.com/intent/follow?screen_name=candleview"><img src="https://img.shields.io/twitter/follow/candleview" alt="CandleView" /></a>
23
+ </p>
24
+ <p align="center">
25
+ <a href="./README_zh-CN.md">简体中文</a> | <a href="./README.md">English</a>
26
+ </p>
27
+
28
+ ## ⚙️ Install
29
+
30
+ ```bash
31
+ npm i @candleview/core
32
+ ```
33
+
34
+ ```bash
35
+ yarn add @candleview/core
36
+ ```
37
+
38
+ # 🌐 Link
39
+
40
+ | Website | Website(CN) | Emulator | Markets |
41
+ | ---------------------------------------------------- | ---------------------------------------------------- | ---------------------------------------------------------------- | ----------------------------------------------------------- |
42
+ | <a href="https://candleview.vercel.app/">Website</a> | <a href="https://www.candleview.cn/">Website(CN)</a> | <a href="https://candleview.vercel.app/application">Emulator</a> | <a href="https://candleview.vercel.app/markets">Markets</a> |
43
+
44
+ # 📚 Directory
45
+
46
+ | **directory** | **describe** |
47
+ | :------------------- | :------------------------------------------------------------------------------------------------------------------- |
48
+ | **core** | CandleView Engine Core. |
49
+ | **react** | CandleView React Component. |
50
+ | **ai-proxy-service** | This is the scaffolding project for CandleView AI services, which you can use to develop AI services for CandleView. |
51
+ | **assets** | Asset Directory. |
52
+
53
+ ## 🚀 Quick Start
54
+
55
+ ```typescript
56
+ // 1. Create with container element
57
+ const chart = new CandleView({ container: document.getElementById("chart") });
58
+ // 2. Create with container selector
59
+ const chart = new CandleView({ containerSelector: "#chart" });
60
+ // 3. Create with element ID
61
+ const chart = new CandleView({ id: "chart" });
62
+ // 4. Create with parent element (auto creates container)
63
+ const chart = new CandleView({ parent: document.getElementById("wrapper") });
64
+ // 5. Create with parent selector (auto creates container)
65
+ const chart = new CandleView({ parentSelector: "#wrapper" });
66
+ ```
67
+
68
+ ### JavaScript
69
+
70
+ ```typescript
71
+ const container = document.getElementById("chart");
72
+ const chart = new CandleView({ container, title: "BTC/USDT", data: klineData });
73
+ ```
74
+
75
+ ### React
76
+
77
+ ```typescript
78
+ const containerRef = useRef<HTMLDivElement>(null);
79
+ useEffect(() => { if (containerRef.current) new CandleView({ container: containerRef.current }); }, []);
80
+ return <div ref={containerRef} style={{ width: "100%", height: "500px" }} />;
81
+
82
+ ```
83
+
84
+ ### Vue3
85
+
86
+ ```typescript
87
+ const containerRef = ref<HTMLDivElement>(null);
88
+ onMounted(() => {
89
+ if (containerRef.value) new CandleView({ container: containerRef.value });
90
+ });
91
+ ```
92
+
93
+ ```html
94
+ <div ref="containerRef" style="width:100%;height:500px"></div>
95
+ ```
96
+
97
+ ### Vue2
98
+
99
+ ```typescript
100
+ mounted() { this.chart = new CandleView({ container: this.$refs.container }); },
101
+ ```
102
+
103
+ ```html
104
+ <div ref="container" style="width:100%;height:500px"></div>
105
+ ```
106
+
107
+ ## Real-Time Data Processing
108
+
109
+ ```typescript
110
+ import { CandleView, ICandleViewDataPoint } from "candleview";
111
+ let lastClose = 50000;
112
+ let currentTime = Math.floor(Date.now() / 1000);
113
+ function generateNewDataPoint(): ICandleViewDataPoint {
114
+ const changePercent = (Math.random() - 0.5) * 0.01;
115
+ const newClose = lastClose * (1 + changePercent);
116
+ const highLowRange = Math.abs(newClose - lastClose) * 0.5;
117
+ const newPoint = {
118
+ time: currentTime++,
119
+ open: lastClose,
120
+ high: Math.max(lastClose, newClose) + Math.random() * highLowRange,
121
+ low: Math.min(lastClose, newClose) - Math.random() * highLowRange,
122
+ close: newClose,
123
+ volume: Math.random() * 1000 + 500,
124
+ };
125
+
126
+ lastClose = newClose;
127
+ return newPoint;
128
+ }
129
+ const chart = new CandleView({
130
+ container: document.getElementById("chart"),
131
+ title: "BTC/USDT",
132
+ data: initialData,
133
+ });
134
+ const interval = setInterval(() => {
135
+ const newPoint = generateNewDataPoint();
136
+ chart.updateData([newPoint]);
137
+ }, 1000);
138
+ ```
139
+
140
+ <img src="../assets/real_time_data_demo.gif" alt="CandleView Static Mark" width="100%">
141
+
142
+ ## Static Mark
143
+
144
+ ### Static Mark Interface parameters
145
+
146
+ ```typescript
147
+ interface IStaticMarkOptions {
148
+ textColor?: string; // Text color, default white
149
+ backgroundColor?: string; // Background color, default red for Top, green for Bottom
150
+ isCircular?: boolean; // Circular background, default true
151
+ fontSize?: number; // Font size, default 9-11
152
+ padding?: number; // Padding, default 3
153
+ label?: string; // Label text for arrow marks
154
+ }
155
+ ```
156
+
157
+ ### Example
158
+
159
+ #### Add Single Text Mark
160
+
161
+ ```typescript
162
+ import { CandleView, StaticMarkDirection, StaticMarkType } from "candleview";
163
+ // Create chart instance
164
+ const chart = new CandleView({
165
+ container: document.getElementById("chart"),
166
+ title: "BTC/USDT",
167
+ theme: "dark",
168
+ data: yourKlineData,
169
+ });
170
+ // Top text mark (red background)
171
+ chart.addTextMark(
172
+ 1704067200, // timestamp
173
+ "📈 Resistance", // text content
174
+ StaticMarkDirection.Top, // direction: Top
175
+ {
176
+ textColor: "#ffffff",
177
+ backgroundColor: "#ff4444",
178
+ isCircular: true,
179
+ fontSize: 10,
180
+ padding: 4,
181
+ },
182
+ );
183
+ // Bottom text mark (green background)
184
+ chart.addTextMark(1704067300, "📉 Support", StaticMarkDirection.Bottom, {
185
+ textColor: "#ffffff",
186
+ backgroundColor: "#44ff44",
187
+ isCircular: true,
188
+ fontSize: 10,
189
+ padding: 4,
190
+ });
191
+ ```
192
+
193
+ #### Add Single Arrow Mark
194
+
195
+ ```typescript
196
+ // Create chart instance
197
+ const chart = new CandleView({
198
+ container: document.getElementById("chart"),
199
+ title: "BTC/USDT",
200
+ theme: "dark",
201
+ data: yourKlineData,
202
+ });
203
+ // Top arrow (sell signal)
204
+ chart.addArrowMark(1704067400, StaticMarkDirection.Top, {
205
+ label: "SELL",
206
+ backgroundColor: "#ff0000",
207
+ });
208
+ // Bottom arrow (buy signal)
209
+ chart.addArrowMark(1704067500, StaticMarkDirection.Bottom, {
210
+ label: "BUY",
211
+ backgroundColor: "#00ff00",
212
+ });
213
+ ```
214
+
215
+ #### Batch Add Text Marks
216
+
217
+ ```typescript
218
+ // Create chart instance
219
+ const chart = new CandleView({
220
+ container: document.getElementById("chart"),
221
+ title: "BTC/USDT",
222
+ theme: "dark",
223
+ data: yourKlineData,
224
+ });
225
+ chart.addTextMarks([
226
+ {
227
+ time: 1704067600,
228
+ text: "📊 Open",
229
+ direction: StaticMarkDirection.Top,
230
+ options: { backgroundColor: "#ff8800", textColor: "#ffffff" },
231
+ },
232
+ {
233
+ time: 1704067700,
234
+ text: "💰 Add",
235
+ direction: StaticMarkDirection.Bottom,
236
+ options: {
237
+ backgroundColor: "#00ff88",
238
+ textColor: "#ffffff",
239
+ isCircular: true,
240
+ },
241
+ },
242
+ {
243
+ time: 1704067800,
244
+ text: "🎯 Take Profit",
245
+ direction: StaticMarkDirection.Top,
246
+ options: { backgroundColor: "#44aaff", textColor: "#ffffff", fontSize: 12 },
247
+ },
248
+ ]);
249
+ ```
250
+
251
+ #### Batch Add Arrow Marks
252
+
253
+ ```typescript
254
+ // Create chart instance
255
+ const chart = new CandleView({
256
+ container: document.getElementById("chart"),
257
+ title: "BTC/USDT",
258
+ theme: "dark",
259
+ data: yourKlineData,
260
+ });
261
+ chart.addArrowMarks([
262
+ {
263
+ time: 1704067900,
264
+ direction: StaticMarkDirection.Top,
265
+ options: { label: "🔻 Sell" },
266
+ },
267
+ {
268
+ time: 1704068000,
269
+ direction: StaticMarkDirection.Bottom,
270
+ options: { label: "🔺 Buy" },
271
+ },
272
+ {
273
+ time: 1704068100,
274
+ direction: StaticMarkDirection.Top,
275
+ options: { label: "⚠️ Caution" },
276
+ },
277
+ ]);
278
+ ```
279
+
280
+ #### Mixed Marks (Text + Arrow)
281
+
282
+ ```typescript
283
+ // Create chart instance
284
+ const chart = new CandleView({
285
+ container: document.getElementById("chart"),
286
+ title: "BTC/USDT",
287
+ theme: "dark",
288
+ data: yourKlineData,
289
+ });
290
+ chart.addStaticMarks([
291
+ {
292
+ time: 1704068200,
293
+ text: "📉 Strong Support",
294
+ direction: StaticMarkDirection.Bottom,
295
+ type: StaticMarkType.Text,
296
+ options: { backgroundColor: "#00cc88", textColor: "#ffffff" },
297
+ },
298
+ {
299
+ time: 1704068300,
300
+ text: "",
301
+ direction: StaticMarkDirection.Top,
302
+ type: StaticMarkType.Arrow,
303
+ options: { backgroundColor: "#ff5566", label: "Resistance" },
304
+ },
305
+ {
306
+ time: 1704068400,
307
+ text: "🏆 Target Hit",
308
+ direction: StaticMarkDirection.Top,
309
+ type: StaticMarkType.Text,
310
+ options: {
311
+ backgroundColor: "#ff44aa",
312
+ textColor: "#ffffff",
313
+ fontSize: 11,
314
+ isCircular: false,
315
+ padding: 6,
316
+ },
317
+ },
318
+ ]);
319
+ ```
320
+
321
+ #### Manage Marks
322
+
323
+ ```typescript
324
+ // Create chart instance
325
+ const chart = new CandleView({
326
+ container: document.getElementById("chart"),
327
+ title: "BTC/USDT",
328
+ theme: "dark",
329
+ data: yourKlineData,
330
+ });
331
+ // Get mark count
332
+ const count = chart.getStaticMarkCount();
333
+ console.log(`Current mark count: ${count}`);
334
+ // Clear all marks
335
+ chart.clearAllStaticMarks();
336
+ ```
337
+
338
+ <img src="../assets/static_mark_demo.gif" alt="CandleView Static Mark" width="100%">
339
+
340
+ ## Multi Panel Performance
341
+
342
+ <img src="../assets/candleview-multi-panel-2.gif" alt="CandleView Multi Panel" width="100%">
343
+
344
+ ## Technical Indicators In The Sub Chart.
345
+
346
+ <img src="../assets/sub-chart.gif" width="100%">
347
+
348
+ ## Preview
349
+
350
+ ### Draw Graphics
351
+
352
+ #### Fibonacci
353
+
354
+ <table>
355
+ <tr>
356
+ <td align="left">
357
+ <h4>Arc</h4>
358
+ </td>
359
+ <td align="left">
360
+ <h4>Channel</h4>
361
+ </td>
362
+ </tr>
363
+ <tr>
364
+ <td align="center"><img src="../assets/fibonacci/fibonacci-arc.gif" width="100%"></td>
365
+ <td align="center"><img src="../assets/fibonacci/fibonacci-channel.gif" width="100%"></td>
366
+ </tr>
367
+ <tr>
368
+ <td align="left">
369
+ <h4>Fan</h4>
370
+ </td>
371
+ <td align="left">
372
+ <h4>Price Extension</h4>
373
+ </td>
374
+ </tr>
375
+ <tr>
376
+ <td align="center"><img src="../assets/fibonacci/fibonacci-fan.gif" width="100%"></td>
377
+ <td align="center"><img src="../assets/fibonacci/fibonacci-price-extension.gif" width="100%"></td>
378
+ </tr>
379
+ <tr>
380
+ <td align="left">
381
+ <h4>Spiral</h4>
382
+ </td>
383
+ <td align="left">
384
+ <h4>Time Expansion</h4>
385
+ </td>
386
+ </tr>
387
+ <tr>
388
+ <td align="center"><img src="../assets/fibonacci/fibonacci-spiral.gif" width="100%"></td>
389
+ <td align="center"><img src="../assets/fibonacci/fibonacci-time-expansion.gif" width="100%"></td>
390
+ </tr>
391
+ <tr>
392
+ <td align="left">
393
+ <h4>Wedge</h4>
394
+ </td>
395
+ <td align="left">
396
+ <h4>Retracement</h4>
397
+ </td>
398
+ </tr>
399
+ <tr>
400
+ <td align="center"><img src="../assets/fibonacci/fibonacci-wedge.gif" width="100%"></td>
401
+ <td align="center"><img src="../assets/fibonacci/fibonacci-retracement.gif" width="100%"></td>
402
+ </tr>
403
+ <tr>
404
+ <td align="left">
405
+ <h4>Time Zoon</h4>
406
+ </td>
407
+ <td align="left">
408
+ <h4>Circle</h4>
409
+ </td>
410
+ </tr>
411
+ <tr>
412
+ <td align="center"><img src="../assets/fibonacci/fibonacci-time-zoon.gif" width="100%"></td>
413
+ <td align="center"><img src="../assets/fibonacci/fibonacci-circle.gif" width="100%"></td>
414
+ </tr>
415
+ </table>
416
+
417
+ #### Gann
418
+
419
+ <table>
420
+ <tr>
421
+ <td align="left">
422
+ <h4>Box</h4>
423
+ </td>
424
+ <td align="left">
425
+ <h4>Fan</h4>
426
+ </tr>
427
+ <tr>
428
+ <td align="center"><img src="../assets/gann/gann-box.gif" width="100%"></td>
429
+ <td align="center"><img src="../assets/gann/gann-fan.gif" width="100%"></td>
430
+ </tr>
431
+ <tr>
432
+ <td align="left">
433
+ <h4>Rectangle</h4>
434
+ </td>
435
+ </tr>
436
+ <tr>
437
+ <td align="center"><img src="../assets/gann//gann-rectangle.gif" width="100%"></td>
438
+ </tr>
439
+ </table>
440
+
441
+ #### Mark
442
+
443
+ <img src="../assets/mark.gif" width="100%">
444
+
445
+ ### Theme
446
+
447
+ <table>
448
+ <tr>
449
+ <td align="left">
450
+ <h4>Dark</h4>
451
+ </td>
452
+ <td align="left">
453
+ <h4>Light</h4>
454
+ </td>
455
+ </tr>
456
+ <tr>
457
+ <td align="center"><img src="../assets/preview_theme_dark.png" width="400"></td>
458
+ <td align="center"><img src="../assets/preview_theme_light.png" width="400"></td>
459
+ </tr>
460
+ </table>
461
+
462
+ ### I18n
463
+
464
+ <table>
465
+ <tr>
466
+ <td align="left">
467
+ <h4>En</h4>
468
+ </td>
469
+ <td align="left">
470
+ <h4>zh-CN</h4>
471
+ </td>
472
+ </tr>
473
+ <tr>
474
+ <td align="center"><img src="../assets/preview_i18n_en.png" width="400"></td>
475
+ <td align="center"><img src="../assets/preview_i18n_zh-CN.png" width="400"></td>
476
+ </tr>
477
+ </table>
478
+
479
+ ## 🔧 Configuration Options
480
+
481
+ ### ⏰ Supported Timeframes
482
+
483
+ #### Second-based Timeframes
484
+
485
+ | Value | Display Name | Description |
486
+ | ------- | ------------------ | ----------- |
487
+ | `'1S'` | 1 秒 / 1 Second | 1 second |
488
+ | `'5S'` | 5 秒 / 5 Seconds | 5 seconds |
489
+ | `'15S'` | 15 秒 / 15 Seconds | 15 seconds |
490
+ | `'30S'` | 30 秒 / 30 Seconds | 30 seconds |
491
+
492
+ #### Minute-based Timeframes
493
+
494
+ | Value | Display Name | Description |
495
+ | ------- | ------------------ | ----------- |
496
+ | `'1M'` | 1 分 / 1 Minute | 1 minute |
497
+ | `'3M'` | 3 分 / 3 Minutes | 3 minutes |
498
+ | `'5M'` | 5 分 / 5 Minutes | 5 minutes |
499
+ | `'15M'` | 15 分 / 15 Minutes | 15 minutes |
500
+ | `'30M'` | 30 分 / 30 Minutes | 30 minutes |
501
+ | `'45M'` | 45 分 / 45 Minutes | 45 minutes |
502
+
503
+ #### Hour-based Timeframes
504
+
505
+ | Value | Display Name | Description |
506
+ | ------- | ------------------ | ----------- |
507
+ | `'1H'` | 1 小时 / 1 Hour | 1 hour |
508
+ | `'2H'` | 2 小时 / 2 Hours | 2 hours |
509
+ | `'3H'` | 3 小时 / 3 Hours | 3 hours |
510
+ | `'4H'` | 4 小时 / 4 Hours | 4 hours |
511
+ | `'6H'` | 6 小时 / 6 Hours | 6 hours |
512
+ | `'8H'` | 8 小时 / 8 Hours | 8 hours |
513
+ | `'12H'` | 12 小时 / 12 Hours | 12 hours |
514
+
515
+ #### Day-based Timeframes
516
+
517
+ | Value | Display Name | Description |
518
+ | ------ | ------------- | ----------- |
519
+ | `'1D'` | 1 日 / 1 Day | 1 day |
520
+ | `'3D'` | 3 日 / 3 Days | 3 days |
521
+
522
+ #### Week-based Timeframes
523
+
524
+ | Value | Display Name | Description |
525
+ | ------ | -------------- | ----------- |
526
+ | `'1W'` | 1 周 / 1 Week | 1 week |
527
+ | `'2W'` | 2 周 / 2 Weeks | 2 weeks |
528
+
529
+ #### Month-based Timeframes
530
+
531
+ | Value | Display Name | Description |
532
+ | -------- | --------------- | ----------- |
533
+ | `'1MON'` | 1 月 / 1 Month | 1 month |
534
+ | `'3MON'` | 3 月 / 3 Months | 3 months |
535
+ | `'6MON'` | 6 月 / 6 Months | 6 months |
536
+
537
+ ### 🌍 Supported Timezones
538
+
539
+ #### Americas
540
+
541
+ | Timezone ID | Display Name | UTC Offset | Major Cities |
542
+ | ----------------------- | -------------------- | ----------- | -------------------------- |
543
+ | `'America/New_York'` | 纽约 / New York | UTC-5/UTC-4 | New York, Washington DC |
544
+ | `'America/Chicago'` | 芝加哥 / Chicago | UTC-6/UTC-5 | Chicago, Dallas |
545
+ | `'America/Denver'` | 丹佛 / Denver | UTC-7/UTC-6 | Denver, Phoenix |
546
+ | `'America/Los_Angeles'` | 洛杉矶 / Los Angeles | UTC-8/UTC-7 | Los Angeles, San Francisco |
547
+ | `'America/Toronto'` | 多伦多 / Toronto | UTC-5/UTC-4 | Toronto, Montreal |
548
+
549
+ #### Europe
550
+
551
+ | Timezone ID | Display Name | UTC Offset | Major Cities |
552
+ | ----------------- | -------------------- | ----------- | -------------------- |
553
+ | `'Europe/London'` | 伦敦 / London | UTC+0/UTC+1 | London, Dublin |
554
+ | `'Europe/Paris'` | 巴黎 / Paris | UTC+1/UTC+2 | Paris, Berlin |
555
+ | `'Europe/Berlin'` | 法兰克福 / Frankfurt | UTC+1/UTC+2 | Frankfurt, Amsterdam |
556
+ | `'Europe/Zurich'` | 苏黎世 / Zurich | UTC+1/UTC+2 | Zurich, Vienna |
557
+ | `'Europe/Moscow'` | 莫斯科 / Moscow | UTC+3 | Moscow, Istanbul |
558
+
559
+ #### Asia
560
+
561
+ | Timezone ID | Display Name | UTC Offset | Major Cities |
562
+ | ------------------ | ------------------ | ---------- | ----------------------- |
563
+ | `'Asia/Dubai'` | 迪拜 / Dubai | UTC+4 | Dubai, Abu Dhabi |
564
+ | `'Asia/Karachi'` | 卡拉奇 / Karachi | UTC+5 | Karachi, Lahore |
565
+ | `'Asia/Kolkata'` | 加尔各答 / Kolkata | UTC+5:30 | Kolkata, Mumbai |
566
+ | `'Asia/Shanghai'` | 上海 / Shanghai | UTC+8 | Shanghai, Beijing |
567
+ | `'Asia/Hong_Kong'` | 香港 / Hong Kong | UTC+8 | Hong Kong, Macau |
568
+ | `'Asia/Singapore'` | 新加坡 / Singapore | UTC+8 | Singapore, Kuala Lumpur |
569
+ | `'Asia/Tokyo'` | 东京 / Tokyo | UTC+9 | Tokyo, Seoul |
570
+ | `'Asia/Seoul'` | 首尔 / Seoul | UTC+9 | Seoul, Pyongyang |
571
+
572
+ #### Pacific
573
+
574
+ | Timezone ID | Display Name | UTC Offset | Major Cities |
575
+ | -------------------- | ----------------- | ------------- | -------------------- |
576
+ | `'Australia/Sydney'` | 悉尼 / Sydney | UTC+10/UTC+11 | Sydney, Melbourne |
577
+ | `'Pacific/Auckland'` | 奥克兰 / Auckland | UTC+12/UTC+13 | Auckland, Wellington |
578
+
579
+ #### Global
580
+
581
+ | Timezone ID | Display Name | UTC Offset | Description |
582
+ | ----------- | ------------ | ---------- | -------------------------- |
583
+ | `'UTC'` | UTC / UTC | UTC+0 | Coordinated Universal Time |
584
+
585
+ ## 🌟 Core Features
586
+
587
+ ### 📈 Supported Technical Indicators
588
+
589
+ #### Main Chart Indicators
590
+
591
+ - Moving Average (MA)
592
+ - Exponential Moving Average (EMA)
593
+ - Bollinger Bands
594
+ - Ichimoku Cloud
595
+ - Donchian Channel
596
+ - Envelope
597
+ - Volume Weighted Average Price (VWAP)
598
+ - Heat Map
599
+ - Market Profile
600
+
601
+ #### Sub Chart Indicators
602
+
603
+ - Relative Strength Index (RSI)
604
+ - Moving Average Convergence Divergence (MACD)
605
+ - Volume
606
+ - Parabolic SAR
607
+ - KDJ Indicator
608
+ - Average True Range (ATR)
609
+ - Stochastic Oscillator
610
+ - Commodity Channel Index (CCI)
611
+ - Bollinger Bands Width
612
+ - Average Directional Index (ADX)
613
+ - On Balance Volume (OBV)
614
+
615
+ ### 🎨 Supported Drawing Tools
616
+
617
+ #### Basic Tools
618
+
619
+ - Pencil, Pen, Brush, Marker Pen, Eraser
620
+ - Line Segment, Horizontal Line, Vertical Line
621
+ - Arrow Line, Thick Arrow Line
622
+
623
+ #### Channel Tools
624
+
625
+ - Parallel Channel
626
+ - Linear Regression Channel
627
+ - Equidistant Channel
628
+ - Disjoint Channel
629
+
630
+ #### Fibonacci Tools
631
+
632
+ - Fibonacci Retracement
633
+ - Fibonacci Time Zones
634
+ - Fibonacci Arc
635
+ - Fibonacci Circle
636
+ - Fibonacci Spiral
637
+ - Fibonacci Fan
638
+ - Fibonacci Channel
639
+ - Fibonacci Price Extension
640
+ - Fibonacci Time Extension
641
+
642
+ #### Gann Tools
643
+
644
+ - Gann Fan
645
+ - Gann Box
646
+ - Gann Rectangle
647
+
648
+ #### Pattern Tools
649
+
650
+ - Andrew Pitchfork
651
+ - Enhanced Andrew Pitchfork
652
+ - Schiff Pitchfork
653
+ - XABCD Pattern
654
+ - Head and Shoulders
655
+ - ABCD Pattern
656
+ - Triangle ABCD Pattern
657
+
658
+ #### Elliott Wave
659
+
660
+ - Elliott Impulse Wave
661
+ - Elliott Corrective Wave
662
+ - Elliott Triangle
663
+ - Elliott Double Combination
664
+ - Elliott Triple Combination
665
+
666
+ #### Geometric Shapes
667
+
668
+ - Rectangle, Circle, Ellipse, Triangle
669
+ - Sector, Curve, Double Curve
670
+
671
+ #### Annotation Tools
672
+
673
+ - Text Annotation, Price Note
674
+ - Bubble Box, Pin, Signpost
675
+ - Price Label, Flag Mark
676
+ - Image Insertion
677
+
678
+ #### Range Tools
679
+
680
+ - Time Range, Price Range
681
+ - Time-Price Range
682
+ - Heat Map
683
+
684
+ #### Trading Tools
685
+
686
+ - Long Position, Short Position
687
+ - Mock K-line
688
+
689
+ ### ⏰ Supported Timeframes
690
+
691
+ #### Second-based
692
+
693
+ - 1s, 5s, 15s, 30s
694
+
695
+ #### Minute-based
696
+
697
+ - 1m, 3m, 5m, 15m
698
+ - 30m, 45m
699
+
700
+ #### Hour-based
701
+
702
+ - 1h, 2h, 3h, 4h
703
+ - 6h, 8h, 12h
704
+
705
+ #### Day-based
706
+
707
+ - 1d, 3d
708
+
709
+ #### Week-based
710
+
711
+ - 1w, 2w
712
+
713
+ #### Month-based
714
+
715
+ - 1M, 3M, 6M
716
+
717
+ ### 🌍 Supported Timezones
718
+
719
+ - New York (America/New_York)
720
+ - Chicago (America/Chicago)
721
+ - Denver (America/Denver)
722
+ - Los Angeles (America/Los_Angeles)
723
+ - Toronto (America/Toronto)
724
+ - London (Europe/London)
725
+ - Paris (Europe/Paris)
726
+ - Frankfurt (Europe/Berlin)
727
+ - Zurich (Europe/Zurich)
728
+ - Moscow (Europe/Moscow)
729
+ - Dubai (Asia/Dubai)
730
+ - Karachi (Asia/Karachi)
731
+ - Kolkata (Asia/Kolkata)
732
+ - Shanghai (Asia/Shanghai)
733
+ - Hong Kong (Asia/Hong_Kong)
734
+ - Singapore (Asia/Singapore)
735
+ - Tokyo (Asia/Tokyo)
736
+ - Seoul (Asia/Seoul)
737
+ - Sydney (Australia/Sydney)
738
+ - Auckland (Pacific/Auckland)
739
+ - UTC
740
+
741
+ ### 🎯 Supported Chart Types
742
+
743
+ - Candlestick Chart
744
+ - Hollow Candlestick Chart
745
+ - Bar Chart (OHLC)
746
+ - BaseLine Chart
747
+ - Line Chart
748
+ - Area Chart
749
+ - Step Line Chart
750
+ - Heikin Ashi Chart
751
+ - Histogram Chart
752
+ - Line Break Chart
753
+ - Mountain Chart
754
+ - Baseline Area Chart
755
+ - High Low Chart
756
+ - HLCArea Chart