-
Notifications
You must be signed in to change notification settings - Fork 551
/
configuration.md
2444 lines (1787 loc) · 89.4 KB
/
configuration.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
---
sidebar_position: 31
slug: /configuration
---
import APITable from '@site/src/components/APITable';
# Chart Configuration
## Serie
- [Bar](#bar)
- [BaseScatter](#basescatter)
- [Candlestick](#candlestick)
- [EffectScatter](#effectscatter)
- [Heatmap](#heatmap)
- [Line](#line)
- [Parallel](#parallel)
- [Pie](#pie)
- [Radar](#radar)
- [Ring](#ring)
- [Scatter](#scatter)
- [Serie](#serie)
- [SimplifiedBar](#simplifiedbar)
- [SimplifiedCandlestick](#simplifiedcandlestick)
- [SimplifiedLine](#simplifiedline)
## Theme
- [AngleAxisTheme](#angleaxistheme)
- [AxisTheme](#axistheme)
- [BaseAxisTheme](#baseaxistheme)
- [ComponentTheme](#componenttheme)
- [DataZoomTheme](#datazoomtheme)
- [LegendTheme](#legendtheme)
- [PolarAxisTheme](#polaraxistheme)
- [RadarAxisTheme](#radaraxistheme)
- [RadiusAxisTheme](#radiusaxistheme)
- [SerieTheme](#serietheme)
- [SubTitleTheme](#subtitletheme)
- [Theme](#theme)
- [ThemeStyle](#themestyle)
- [TitleTheme](#titletheme)
- [TooltipTheme](#tooltiptheme)
- [UIComponentTheme](#uicomponenttheme)
- [VisualMapTheme](#visualmaptheme)
## MainComponent
- [AngleAxis](#angleaxis)
- [Axis](#axis)
- [Background](#background)
- [CalendarCoord](#calendarcoord)
- [Comment](#comment)
- [CoordSystem](#coordsystem)
- [DataZoom](#datazoom)
- [GridCoord](#gridcoord)
- [GridLayout](#gridlayout)
- [Legend](#legend)
- [MarkArea](#markarea)
- [MarkLine](#markline)
- [ParallelAxis](#parallelaxis)
- [ParallelCoord](#parallelcoord)
- [PolarCoord](#polarcoord)
- [RadarCoord](#radarcoord)
- [RadiusAxis](#radiusaxis)
- [Settings](#settings)
- [SingleAxis](#singleaxis)
- [SingleAxisCoord](#singleaxiscoord)
- [Title](#title)
- [Tooltip](#tooltip)
- [VisualMap](#visualmap)
- [XAxis](#xaxis)
- [YAxis](#yaxis)
## ChildComponent
- [AngleAxisTheme](#angleaxistheme)
- [AnimationStyle](#animationstyle)
- [AreaStyle](#areastyle)
- [ArrowStyle](#arrowstyle)
- [AxisLabel](#axislabel)
- [AxisLine](#axisline)
- [AxisMinorSplitLine](#axisminorsplitline)
- [AxisMinorTick](#axisminortick)
- [AxisName](#axisname)
- [AxisSplitArea](#axissplitarea)
- [AxisSplitLine](#axissplitline)
- [AxisTheme](#axistheme)
- [AxisTick](#axistick)
- [BaseAxisTheme](#baseaxistheme)
- [BaseLine](#baseline)
- [BlurStyle](#blurstyle)
- [CommentItem](#commentitem)
- [CommentMarkStyle](#commentmarkstyle)
- [ComponentTheme](#componenttheme)
- [DataZoomTheme](#datazoomtheme)
- [EmphasisStyle](#emphasisstyle)
- [EndLabelStyle](#endlabelstyle)
- [IconStyle](#iconstyle)
- [ImageStyle](#imagestyle)
- [ItemStyle](#itemstyle)
- [LabelLine](#labelline)
- [LabelStyle](#labelstyle)
- [LegendTheme](#legendtheme)
- [Level](#level)
- [LevelStyle](#levelstyle)
- [LineArrow](#linearrow)
- [LineStyle](#linestyle)
- [Location](#location)
- [MarkAreaData](#markareadata)
- [MarkLineData](#marklinedata)
- [MarqueeStyle](#marqueestyle)
- [MLValue](#mlvalue)
- [Padding](#padding)
- [PolarAxisTheme](#polaraxistheme)
- [RadarAxisTheme](#radaraxistheme)
- [RadiusAxisTheme](#radiusaxistheme)
- [SelectStyle](#selectstyle)
- [SerieData](#seriedata)
- [SerieSymbol](#seriesymbol)
- [SerieTheme](#serietheme)
- [StageColor](#stagecolor)
- [StateStyle](#statestyle)
- [SubTitleTheme](#subtitletheme)
- [SymbolStyle](#symbolstyle)
- [TextLimit](#textlimit)
- [TextPadding](#textpadding)
- [TextStyle](#textstyle)
- [ThemeStyle](#themestyle)
- [TitleStyle](#titlestyle)
- [TitleTheme](#titletheme)
- [TooltipTheme](#tooltiptheme)
- [UIComponentTheme](#uicomponenttheme)
- [VisualMapRange](#visualmaprange)
- [VisualMapTheme](#visualmaptheme)
## ISerieComponent
- [AreaStyle](#areastyle)
- [BlurStyle](#blurstyle)
- [EmphasisStyle](#emphasisstyle)
- [ImageStyle](#imagestyle)
- [LabelLine](#labelline)
- [LabelStyle](#labelstyle)
- [LineArrow](#linearrow)
- [SelectStyle](#selectstyle)
- [TitleStyle](#titlestyle)
## ISerieDataComponent
- [AreaStyle](#areastyle)
- [BlurStyle](#blurstyle)
- [EmphasisStyle](#emphasisstyle)
- [ImageStyle](#imagestyle)
- [ItemStyle](#itemstyle)
- [LabelLine](#labelline)
- [LabelStyle](#labelstyle)
- [LineStyle](#linestyle)
- [SelectStyle](#selectstyle)
- [SerieSymbol](#seriesymbol)
- [TitleStyle](#titlestyle)
## Other
- [AnimationAddition](#animationaddition)
- [AnimationChange](#animationchange)
- [AnimationFadeIn](#animationfadein)
- [AnimationFadeOut](#animationfadeout)
- [AnimationHiding](#animationhiding)
- [AnimationInfo](#animationinfo)
- [AnimationInteraction](#animationinteraction)
- [BaseSerie](#baseserie)
- [ChartText](#charttext)
- [ChildComponent](#childcomponent)
- [DebugInfo](#debuginfo)
- [Indicator](#indicator)
- [INeedSerieContainer](#ineedseriecontainer)
- [IPropertyChanged](#ipropertychanged)
- [ISerieComponent](#iseriecomponent)
- [ISerieContainer](#iseriecontainer)
- [ISerieDataComponent](#iseriedatacomponent)
- [ISimplifiedSerie](#isimplifiedserie)
- [IUpdateRuntimeData](#iupdateruntimedata)
- [Lang](#lang)
- [LangCandlestick](#langcandlestick)
- [LangTime](#langtime)
- [MainComponent](#maincomponent)
- [XCResourcesImporter](#xcresourcesimporter)
- [XCSettings](#xcsettings)
## AngleAxis
> XCharts.Runtime.AngleAxis : [Axis](#axis)
Angle axis of Polar Coordinate.
```mdx-code-block
<APITable name="AngleAxis">
```
|field|default|since|comment|
|--|--|--|--|
|startAngle|0||Starting angle of axis. 0 degrees by default, standing for right position of center.
```mdx-code-block
</APITable>
```
## AngleAxisTheme
> XCharts.Runtime.AngleAxisTheme : [BaseAxisTheme](#baseaxistheme)
## AnimationAddition
> XCharts.Runtime.AnimationAddition : [AnimationInfo](#animationinfo)
> Since `v3.8.0`
Data addition animation.
## AnimationChange
> XCharts.Runtime.AnimationChange : [AnimationInfo](#animationinfo)
> Since `v3.8.0`
Data change animation.
## AnimationFadeIn
> XCharts.Runtime.AnimationFadeIn : [AnimationInfo](#animationinfo)
> Since `v3.8.0`
Fade in animation.
## AnimationFadeOut
> XCharts.Runtime.AnimationFadeOut : [AnimationInfo](#animationinfo)
> Since `v3.8.0`
Fade out animation.
## AnimationHiding
> XCharts.Runtime.AnimationHiding : [AnimationInfo](#animationinfo)
> Since `v3.8.0`
Data hiding animation.
## AnimationInfo
> XCharts.Runtime.AnimationInfo / Subclasses: [AnimationFadeIn](#animationfadein), [AnimationFadeOut](#animationfadeout), [AnimationChange](#animationchange), [AnimationAddition](#animationaddition), [AnimationHiding](#animationhiding), [AnimationInteraction](#animationinteraction)
> Since `v3.8.0`
the animation info.
```mdx-code-block
<APITable name="AnimationInfo">
```
|field|default|since|comment|
|--|--|--|--|
|enable|true|v3.8.0|whether enable animation.
|reverse|false|v3.8.0|whether enable reverse animation.
|delay|0|v3.8.0|the delay time before animation start.
|duration|1000|v3.8.0|the duration of animation.
```mdx-code-block
</APITable>
```
## AnimationInteraction
> XCharts.Runtime.AnimationInteraction : [AnimationInfo](#animationinfo)
> Since `v3.8.0`
Interactive animation of charts.
```mdx-code-block
<APITable name="AnimationInteraction">
```
|field|default|since|comment|
|--|--|--|--|
|width||v3.8.0|the mlvalue of width. [MLValue](#mlvalue)|
|radius||v3.8.0|the mlvalue of radius. [MLValue](#mlvalue)|
|offset||v3.8.0|the mlvalue of offset. Such as the offset of the pie chart when the sector is selected. [MLValue](#mlvalue)|
```mdx-code-block
</APITable>
```
## AnimationStyle
> XCharts.Runtime.AnimationStyle : [ChildComponent](#childcomponent)
the animation of serie. support animation type: fadeIn, fadeOut, change, addition.
```mdx-code-block
<APITable name="AnimationStyle">
```
|field|default|since|comment|
|--|--|--|--|
|enable|true||Whether to enable animation.
|type|||The type of animation.<br/>`AnimationType`:<br/>- `Default`: he default. An animation playback mode will be selected according to the actual situation.<br/>- `LeftToRight`: Play the animation from left to right.<br/>- `BottomToTop`: Play the animation from bottom to top.<br/>- `InsideOut`: Play animations from the inside out.<br/>- `AlongPath`: Play the animation along the path.<br/>- `Clockwise`: Play the animation clockwise.<br/>|
|easting|||<br/>`AnimationEasing`:<br/>- `Linear`: <br/>|
|threshold|2000||Whether to set graphic number threshold to animation. Animation will be disabled when graphic number is larger than threshold.
|unscaledTime||v3.4.0|Animation updates independently of Time.timeScale.
|fadeIn||v3.8.0|Fade in animation configuration. [AnimationFadeIn](#animationfadein)|
|fadeOut||v3.8.0|Fade out animation configuration. [AnimationFadeOut](#animationfadeout)|
|change||v3.8.0|Update data animation configuration. [AnimationChange](#animationchange)|
|addition||v3.8.0|Add data animation configuration. [AnimationAddition](#animationaddition)|
|hiding||v3.8.0|Data hiding animation configuration. [AnimationHiding](#animationhiding)|
|interaction||v3.8.0|Interaction animation configuration. [AnimationInteraction](#animationinteraction)|
```mdx-code-block
</APITable>
```
## AreaStyle
> XCharts.Runtime.AreaStyle : [ChildComponent](#childcomponent), [ISerieComponent](#iseriecomponent), [ISerieDataComponent](#iseriedatacomponent)
The style of area.
```mdx-code-block
<APITable name="AreaStyle">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Set this to false to prevent the areafrom showing.
|origin|||the origin of area.<br/>`AreaStyle.AreaOrigin`:<br/>- `Auto`: to fill between axis line to data.<br/>- `Start`: to fill between min axis value (when not inverse) to data.<br/>- `End`: to fill between max axis value (when not inverse) to data.<br/>|
|color|||the color of area,default use serie color.
|toColor|||Gradient color, start color to toColor.
|opacity|0.6f||Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.
|innerFill||v3.2.0|Whether to fill only polygonal areas. Currently, only convex polygons are supported.
|toTop|true|v3.6.0|Whether to fill the gradient color to the top. The default is true, which means that the gradient color is filled to the top. If it is false, the gradient color is filled to the actual position.
```mdx-code-block
</APITable>
```
## ArrowStyle
> XCharts.Runtime.ArrowStyle : [ChildComponent](#childcomponent)
```mdx-code-block
<APITable name="ArrowStyle">
```
|field|default|since|comment|
|--|--|--|--|
|width|10||The widht of arrow.
|height|15||The height of arrow.
|offset|0||The offset of arrow.
|dent|3||The dent of arrow.
|color|Color.clear||the color of arrow.
```mdx-code-block
</APITable>
```
## Axis
> XCharts.Runtime.Axis : [MainComponent](#maincomponent) / Subclasses: [AngleAxis](#angleaxis), [ParallelAxis](#parallelaxis), [RadiusAxis](#radiusaxis), [SingleAxis](#singleaxis), [XAxis](#xaxis), [YAxis](#yaxis)
The axis in rectangular coordinate.
```mdx-code-block
<APITable name="Axis">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Whether to show axis.
|type|||the type of axis.<br/>`Axis.AxisType`:<br/>- `Value`: Numerical axis, suitable for continuous data.<br/>- `Category`: Category axis, suitable for discrete category data. Data should only be set via data for this type.<br/>- `Log`: Log axis, suitable for log data.<br/>- `Time`: Time axis, suitable for continuous time series data.<br/>|
|minMaxType|||the type of axis minmax.<br/>`Axis.AxisMinMaxType`:<br/>- `Default`: 0 - maximum.<br/>- `MinMax`: minimum - maximum.<br/>- `Custom`: Customize the minimum and maximum.<br/>- `MinMaxAuto`: [since("v3.7.0")]minimum - maximum, automatically calculate the appropriate values.<br/>|
|gridIndex|||The index of the grid on which the axis are located, by default, is in the first grid.
|polarIndex|||The index of the polar on which the axis are located, by default, is in the first polar.
|parallelIndex|||The index of the parallel on which the axis are located, by default, is in the first parallel.
|position|||the position of axis in grid.<br/>`Axis.AxisPosition`:<br/>- `Left`: the position of axis in grid.<br/>- `Right`: the position of axis in grid.<br/>- `Bottom`: the position of axis in grid.<br/>- `Top`: the position of axis in grid.<br/>|
|offset|||the offset of axis from the default position. Useful when the same position has multiple axes.
|min|||The minimun value of axis.Valid when `minMaxType` is `Custom`
|max|||The maximum value of axis.Valid when `minMaxType` is `Custom`
|splitNumber|0||Number of segments that the axis is split into.
|interval|0||Compulsively set segmentation interval for axis.This is unavailable for category axis.
|boundaryGap|true||The boundary gap on both sides of a coordinate axis, which is valid only for category axis with type: 'Category'.
|maxCache|0||The max number of axis data cache.
|logBase|10||Base of logarithm, which is valid only for numeric axes with type: 'Log'.
|logBaseE|false||On the log axis, if base e is the natural number, and is true, logBase fails.
|ceilRate|0||The ratio of maximum and minimum values rounded upward. The default is 0, which is automatically calculated.
|inverse|false||Whether the axis are reversed or not. Invalid in `Category` axis.
|clockwise|true||Whether the positive position of axis is in clockwise. True for clockwise by default.
|insertDataToHead|||Whether to add new data at the head or at the end of the list.
|icons|||类目数据对应的图标。
|data|||Category data, available in type: 'Category' axis.
|axisLine|||axis Line. [AxisLine](#axisline)|
|axisName|||axis name. [AxisName](#axisname)|
|axisTick|||axis tick. [AxisTick](#axistick)|
|axisLabel|||axis label. [AxisLabel](#axislabel)|
|splitLine|||axis split line. [AxisSplitLine](#axissplitline)|
|splitArea|||axis split area. [AxisSplitArea](#axissplitarea)|
|minorTick||v3.2.0|axis minor tick. [AxisMinorTick](#axisminortick)|
|minorSplitLine||v3.2.0|axis minor split line. [AxisMinorSplitLine](#axisminorsplitline)|
|indicatorLabel||v3.4.0|Style of axis tooltip indicator label. [LabelStyle](#labelstyle)|
```mdx-code-block
</APITable>
```
## AxisLabel
> XCharts.Runtime.AxisLabel : [LabelStyle](#labelstyle)
Settings related to axis label.
```mdx-code-block
<APITable name="AxisLabel">
```
|field|default|since|comment|
|--|--|--|--|
|interval|0||The display interval of the axis label.
|inside|false||Set this to true so the axis labels face the inside direction.
|showAsPositiveNumber|false||Show negative number as positive number.
|onZero|false||刻度标签显示在0刻度上。
|showStartLabel|true||Whether to display the first label.
|showEndLabel|true||Whether to display the last label.
|textLimit|||文本限制。 [TextLimit](#textlimit)|
```mdx-code-block
</APITable>
```
## AxisLine
> XCharts.Runtime.AxisLine : [BaseLine](#baseline)
Settings related to axis line.
```mdx-code-block
<APITable name="AxisLine">
```
|field|default|since|comment|
|--|--|--|--|
|onZero|||When mutiple axes exists, this option can be used to specify which axis can be "onZero" to.
|showArrow|||Whether to show the arrow symbol of axis.
|arrow|||the arrow of line. [ArrowStyle](#arrowstyle)|
```mdx-code-block
</APITable>
```
## AxisMinorSplitLine
> XCharts.Runtime.AxisMinorSplitLine : [BaseLine](#baseline)
> Since `v3.2.0`
Minor split line of axis in grid area.
```mdx-code-block
<APITable name="AxisMinorSplitLine">
```
|field|default|since|comment|
|--|--|--|--|
|distance|||The distance between the split line and axis line.
|autoColor|||auto color.
```mdx-code-block
</APITable>
```
## AxisMinorTick
> XCharts.Runtime.AxisMinorTick : [BaseLine](#baseline)
> Since `v3.2.0`
Settings related to axis minor tick.
```mdx-code-block
<APITable name="AxisMinorTick">
```
|field|default|since|comment|
|--|--|--|--|
|splitNumber|5||Number of segments that the axis is split into.
|autoColor|||
```mdx-code-block
</APITable>
```
## AxisName
> XCharts.Runtime.AxisName : [ChildComponent](#childcomponent)
the name of axis.
```mdx-code-block
<APITable name="AxisName">
```
|field|default|since|comment|
|--|--|--|--|
|show|||Whether to show axis name.
|name|||the name of axis.
|onZero||v3.1.0|Whether the axis name position are the same with 0 position of YAxis.
|labelStyle|||The text style of axis name. [LabelStyle](#labelstyle)|
```mdx-code-block
</APITable>
```
## AxisSplitArea
> XCharts.Runtime.AxisSplitArea : [ChildComponent](#childcomponent)
Split area of axis in grid area, not shown by default.
```mdx-code-block
<APITable name="AxisSplitArea">
```
|field|default|since|comment|
|--|--|--|--|
|show|||Set this to true to show the splitArea.
|color|||Color of split area. SplitArea color could also be set in color array, which the split lines would take as their colors in turns. Dark and light colors in turns are used by default.
```mdx-code-block
</APITable>
```
## AxisSplitLine
> XCharts.Runtime.AxisSplitLine : [BaseLine](#baseline)
Split line of axis in grid area.
```mdx-code-block
<APITable name="AxisSplitLine">
```
|field|default|since|comment|
|--|--|--|--|
|interval|||Interval of Axis splitLine.
|distance|||The distance between the split line and axis line.
|autoColor|||auto color.
|showStartLine|true|v3.3.0|Whether to show the first split line.
|showEndLine|true|v3.3.0|Whether to show the last split line.
```mdx-code-block
</APITable>
```
## AxisTheme
> XCharts.Runtime.AxisTheme : [BaseAxisTheme](#baseaxistheme)
## AxisTick
> XCharts.Runtime.AxisTick : [BaseLine](#baseline)
Settings related to axis tick.
```mdx-code-block
<APITable name="AxisTick">
```
|field|default|since|comment|
|--|--|--|--|
|alignWithLabel|||Align axis tick with label, which is available only when boundaryGap is set to be true in category axis.
|inside|||Set this to true so the axis labels face the inside direction.
|showStartTick|||Whether to display the first tick.
|showEndTick|||Whether to display the last tick.
|distance|||The distance between the tick line and axis line.
|splitNumber|0||Number of segments that the axis is split into.
|autoColor|||
```mdx-code-block
</APITable>
```
## Background
> XCharts.Runtime.Background : [MainComponent](#maincomponent)
Background component.
```mdx-code-block
<APITable name="Background">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Whether to enable the background component.
|image|||the image of background.
|imageType|||the fill type of background image.
|imageColor|||背景图颜色。
|autoColor|true||Whether to use theme background color for component color when the background component is on.
```mdx-code-block
</APITable>
```
## Bar
> XCharts.Runtime.Bar : [Serie](#serie), [INeedSerieContainer](#ineedseriecontainer)
## BaseAxisTheme
> XCharts.Runtime.BaseAxisTheme : [ComponentTheme](#componenttheme) / Subclasses: [AxisTheme](#axistheme), [RadiusAxisTheme](#radiusaxistheme), [AngleAxisTheme](#angleaxistheme), [PolarAxisTheme](#polaraxistheme), [RadarAxisTheme](#radaraxistheme)
```mdx-code-block
<APITable name="BaseAxisTheme">
```
|field|default|since|comment|
|--|--|--|--|
|lineType|||the type of line.<br/>`LineStyle.Type`:<br/>- `Solid`: 实线<br/>- `Dashed`: 虚线<br/>- `Dotted`: 点线<br/>- `DashDot`: 点划线<br/>- `DashDotDot`: 双点划线<br/>- `None`: 双点划线<br/>|
|lineWidth|1f||the width of line.
|lineLength|0f||the length of line.
|lineColor|||the color of line.
|splitLineType|||the type of split line.<br/>`LineStyle.Type`:<br/>- `Solid`: 实线<br/>- `Dashed`: 虚线<br/>- `Dotted`: 点线<br/>- `DashDot`: 点划线<br/>- `DashDotDot`: 双点划线<br/>- `None`: 双点划线<br/>|
|splitLineWidth|1f||the width of split line.
|splitLineLength|0f||the length of split line.
|splitLineColor|||the color of split line.
|minorSplitLineColor|||the color of minor split line.
|tickWidth|1f||the width of tick.
|tickLength|5f||the length of tick.
|tickColor|||the color of tick.
|splitAreaColors|||the colors of split area.
```mdx-code-block
</APITable>
```
## BaseLine
> XCharts.Runtime.BaseLine : [ChildComponent](#childcomponent) / Subclasses: [AxisLine](#axisline), [AxisMinorSplitLine](#axisminorsplitline), [AxisMinorTick](#axisminortick), [AxisSplitLine](#axissplitline), [AxisTick](#axistick)
Settings related to base line.
```mdx-code-block
<APITable name="BaseLine">
```
|field|default|since|comment|
|--|--|--|--|
|show|||Set this to false to prevent the axis line from showing.
|lineStyle|||线条样式 [LineStyle](#linestyle)|
```mdx-code-block
</APITable>
```
## BaseScatter
> XCharts.Runtime.BaseScatter : [Serie](#serie), [INeedSerieContainer](#ineedseriecontainer) / Subclasses: [EffectScatter](#effectscatter), [Scatter](#scatter)
## BaseSerie
> XCharts.Runtime.BaseSerie / Subclasses: [Serie](#serie)
## BlurStyle
> XCharts.Runtime.BlurStyle : [StateStyle](#statestyle), [ISerieComponent](#iseriecomponent), [ISerieDataComponent](#iseriedatacomponent)
> Since `v3.2.0`
Configurations of blur state.
## CalendarCoord
> XCharts.Runtime.CalendarCoord : [CoordSystem](#coordsystem), [IUpdateRuntimeData](#iupdateruntimedata), [ISerieContainer](#iseriecontainer)
## Candlestick
> XCharts.Runtime.Candlestick : [Serie](#serie), [INeedSerieContainer](#ineedseriecontainer)
## ChartText
> XCharts.Runtime.ChartText
## ChildComponent
> XCharts.Runtime.ChildComponent / Subclasses: [AnimationStyle](#animationstyle), [AxisName](#axisname), [AxisSplitArea](#axissplitarea), [AreaStyle](#areastyle), [ArrowStyle](#arrowstyle), [BaseLine](#baseline), [IconStyle](#iconstyle), [ImageStyle](#imagestyle), [ItemStyle](#itemstyle), [Level](#level), [LevelStyle](#levelstyle), [LineArrow](#linearrow), [LineStyle](#linestyle), [Location](#location), [MLValue](#mlvalue), [MarqueeStyle](#marqueestyle), [Padding](#padding), [StageColor](#stagecolor), [SymbolStyle](#symbolstyle), [TextLimit](#textlimit), [TextStyle](#textstyle), [CommentItem](#commentitem), [CommentMarkStyle](#commentmarkstyle), [LabelLine](#labelline), [LabelStyle](#labelstyle), [MarkAreaData](#markareadata), [MarkLineData](#marklinedata), [StateStyle](#statestyle), [VisualMapRange](#visualmaprange), [UIComponentTheme](#uicomponenttheme), [SerieData](#seriedata), [ComponentTheme](#componenttheme), [SerieTheme](#serietheme), [ThemeStyle](#themestyle)
## Comment
> XCharts.Runtime.Comment : [MainComponent](#maincomponent), [IPropertyChanged](#ipropertychanged)
comment of chart.
```mdx-code-block
<APITable name="Comment">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Set this to false to prevent the comment from showing.
|labelStyle|||The text style of all comments. [LabelStyle](#labelstyle)|
|markStyle|||The text style of all comments. [CommentMarkStyle](#commentmarkstyle)|
|items|||The items of comment.
```mdx-code-block
</APITable>
```
## CommentItem
> XCharts.Runtime.CommentItem : [ChildComponent](#childcomponent)
comment of chart.
```mdx-code-block
<APITable name="CommentItem">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Set this to false to prevent this comment item from showing.
|content|||content of comment.
|markRect|||the mark rect of comment.
|markStyle|||the mark rect style. [CommentMarkStyle](#commentmarkstyle)|
|labelStyle|||The text style of all comments. [LabelStyle](#labelstyle)|
|location||v3.5.0|The location of comment. [Location](#location)|
```mdx-code-block
</APITable>
```
## CommentMarkStyle
> XCharts.Runtime.CommentMarkStyle : [ChildComponent](#childcomponent)
the comment mark style.
```mdx-code-block
<APITable name="CommentMarkStyle">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Set this to false to prevent this comment item from showing.
|lineStyle|||line style of comment mark area. [LineStyle](#linestyle)|
```mdx-code-block
</APITable>
```
## ComponentTheme
> XCharts.Runtime.ComponentTheme : [ChildComponent](#childcomponent) / Subclasses: [BaseAxisTheme](#baseaxistheme), [DataZoomTheme](#datazoomtheme), [LegendTheme](#legendtheme), [SubTitleTheme](#subtitletheme), [TitleTheme](#titletheme), [TooltipTheme](#tooltiptheme), [VisualMapTheme](#visualmaptheme)
```mdx-code-block
<APITable name="ComponentTheme">
```
|field|default|since|comment|
|--|--|--|--|
|font|||the font of text.
|textColor|||the color of text.
|textBackgroundColor|||the color of text.
|fontSize|18||the font size of text.
|tMPFont|||the font of chart text。
```mdx-code-block
</APITable>
```
## CoordSystem
> XCharts.Runtime.CoordSystem : [MainComponent](#maincomponent) / Subclasses: [RadarCoord](#radarcoord), [CalendarCoord](#calendarcoord), [GridCoord](#gridcoord), [ParallelCoord](#parallelcoord), [PolarCoord](#polarcoord), [SingleAxisCoord](#singleaxiscoord)
Coordinate system component.
## DataZoom
> XCharts.Runtime.DataZoom : [MainComponent](#maincomponent), [IUpdateRuntimeData](#iupdateruntimedata)
DataZoom component is used for zooming a specific area, which enables user to investigate data in detail, or get an overview of the data, or get rid of outlier points.
```mdx-code-block
<APITable name="DataZoom">
```
|field|default|since|comment|
|--|--|--|--|
|enable|true||Whether to show dataZoom.
|filterMode|||The mode of data filter.<br/>`DataZoom.FilterMode`:<br/>- `Filter`: data that outside the window will be filtered, which may lead to some changes of windows of other axes. For each data item, it will be filtered if one of the relevant dimensions is out of the window.<br/>- `WeakFilter`: data that outside the window will be filtered, which may lead to some changes of windows of other axes. For each data item, it will be filtered only if all of the relevant dimensions are out of the same side of the window.<br/>- `Empty`: data that outside the window will be set to NaN, which will not lead to changes of windows of other axes.<br/>- `None`: Do not filter data.<br/>|
|xAxisIndexs|||Specify which xAxis is controlled by the dataZoom.
|yAxisIndexs|||Specify which yAxis is controlled by the dataZoom.
|supportInside|||Whether built-in support is supported. Built into the coordinate system to allow the user to zoom in and out of the coordinate system by mouse dragging, mouse wheel, finger swiping (on the touch screen).
|supportInsideScroll|true||Whether inside scrolling is supported.
|supportInsideDrag|true||Whether insde drag is supported.
|supportSlider|||Whether a slider is supported. There are separate sliders on which the user zooms or roams.
|supportMarquee|||Supported Box Selected. Provides a marquee for scaling the data area.
|showDataShadow|||Whether to show data shadow, to indicate the data tendency in brief.
|showDetail|||Whether to show detail, that is, show the detailed data information when dragging.
|zoomLock|||Specify whether to lock the size of window (selected area).
|fillerColor|||the color of dataZoom data area.
|borderColor|||the color of dataZoom border.
|borderWidth|||边框宽。
|backgroundColor|||The background color of the component.
|left|||Distance between dataZoom component and the left side of the container. left value is a instant pixel value like 10 or float value [0-1].
|right|||Distance between dataZoom component and the right side of the container. right value is a instant pixel value like 10 or float value [0-1].
|top|||Distance between dataZoom component and the top side of the container. top value is a instant pixel value like 10 or float value [0-1].
|bottom|||Distance between dataZoom component and the bottom side of the container. bottom value is a instant pixel value like 10 or float value [0-1].
|rangeMode|||Use absolute value or percent value in DataZoom.start and DataZoom.end.<br/>`DataZoom.RangeMode`:<br/>- `//Value`: The value type of start and end.取值类型<br/>- `Percent`: percent value.<br/>|
|start|||The start percentage of the window out of the data extent, in the range of 0 ~ 100.
|end|||The end percentage of the window out of the data extent, in the range of 0 ~ 100.
|minShowNum|2||Minimum number of display data. Minimum number of data displayed when DataZoom is enlarged to maximum.
|scrollSensitivity|1.1f||The sensitivity of dataZoom scroll. The larger the number, the more sensitive it is.
|orient|||Specify whether the layout of dataZoom component is horizontal or vertical. What's more, it indicates whether the horizontal axis or vertical axis is controlled by default in catesian coordinate system.<br/>`Orient`:<br/>- `Horizonal`: 水平<br/>- `Vertical`: 垂直<br/>|
|labelStyle|||label style. [LabelStyle](#labelstyle)|
|lineStyle|||阴影线条样式。 [LineStyle](#linestyle)|
|areaStyle|||阴影填充样式。 [AreaStyle](#areastyle)|
|marqueeStyle||v3.5.0|选取框样式。 [MarqueeStyle](#marqueestyle)|
|startLock||v3.6.0|Lock start value.
|endLock||v3.6.0|Lock end value.
```mdx-code-block
</APITable>
```
## DataZoomTheme
> XCharts.Runtime.DataZoomTheme : [ComponentTheme](#componenttheme)
```mdx-code-block
<APITable name="DataZoomTheme">
```
|field|default|since|comment|
|--|--|--|--|
|borderWidth|||the width of border line.
|dataLineWidth|||the width of data line.
|fillerColor|||the color of dataZoom data area.
|borderColor|||the color of dataZoom border.
|dataLineColor|||the color of data area line.
|dataAreaColor|||the color of data area line.
|backgroundColor|||the background color of datazoom.
```mdx-code-block
</APITable>
```
## DebugInfo
> XCharts.Runtime.DebugInfo
```mdx-code-block
<APITable name="DebugInfo">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Whether show debug component.
|showDebugInfo|false||
|showAllChartObject|false||Whether show children components of chart in hierarchy view.
|foldSeries|false||Whether to fold series in inspector view.
|labelStyle||| [LabelStyle](#labelstyle)|
```mdx-code-block
</APITable>
```
## EffectScatter
> XCharts.Runtime.EffectScatter : [BaseScatter](#basescatter)
## EmphasisStyle
> XCharts.Runtime.EmphasisStyle : [StateStyle](#statestyle), [ISerieComponent](#iseriecomponent), [ISerieDataComponent](#iseriedatacomponent)
> Since `v3.2.0`
Configurations of emphasis state.
```mdx-code-block
<APITable name="EmphasisStyle">
```
|field|default|since|comment|
|--|--|--|--|
|scale|1.1f||Whether to scale to highlight the data in emphasis state.
|focus|||When the data is highlighted, whether to fade out of other data to focus the highlighted.<br/>`EmphasisStyle.FocusType`:<br/>- `None`: Do not fade out other data, it's by default.<br/>- `Self`: Only focus (not fade out) the element of the currently highlighted data.<br/>- `Series`: Focus on all elements of the series which the currently highlighted data belongs to.<br/>|
|blurScope|||The range of fade out when focus is enabled.<br/>`EmphasisStyle.BlurScope`:<br/>- `GridCoord`: coordinate system.<br/>- `Series`: series.<br/>- `Global`: global.<br/>|
```mdx-code-block
</APITable>
```
## EndLabelStyle
> XCharts.Runtime.EndLabelStyle : [LabelStyle](#labelstyle)
## GridCoord
> XCharts.Runtime.GridCoord : [CoordSystem](#coordsystem), [IUpdateRuntimeData](#iupdateruntimedata), [ISerieContainer](#iseriecontainer)
Grid component.
```mdx-code-block
<APITable name="GridCoord">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Whether to show the grid in rectangular coordinate.
|layoutIndex|-1|v3.8.0|The index of the grid layout component to which the grid belongs. The default is -1, which means that it does not belong to any grid layout component. When this value is set, the left, right, top, and bottom properties will be invalid.
|left|0.1f||Distance between grid component and the left side of the container.
|right|0.08f||Distance between grid component and the right side of the container.
|top|0.22f||Distance between grid component and the top side of the container.
|bottom|0.12f||Distance between grid component and the bottom side of the container.
|backgroundColor|||Background color of grid, which is transparent by default.
|showBorder|false||Whether to show the grid border.
|borderWidth|0f||Border width of grid.
|borderColor|||The color of grid border.
```mdx-code-block
</APITable>
```
## GridLayout
> XCharts.Runtime.GridLayout : [MainComponent](#maincomponent), [IUpdateRuntimeData](#iupdateruntimedata)
> Since `v3.8.0`
Grid layout component. Used to manage the layout of multiple `GridCoord`, and the number of rows and columns of the grid can be controlled by `row` and `column`.
```mdx-code-block
<APITable name="GridLayout">
```
|field|default|since|comment|
|--|--|--|--|
|show|true||Whether to show the grid in rectangular coordinate.
|left|0.1f||Distance between grid component and the left side of the container.
|right|0.08f||Distance between grid component and the right side of the container.
|top|0.22f||Distance between grid component and the top side of the container.
|bottom|0.12f||Distance between grid component and the bottom side of the container.
|row|2||the row count of grid layout.
|column|2||the column count of grid layout.
|spacing|Vector2.zero||the spacing of grid layout.
|inverse|false||Whether to inverse the grid layout.
```mdx-code-block
</APITable>
```
## Heatmap