igniteui-xplat-examples/samples/charts/data-chart/data-annotation-rect-layer.json at 25.2 · IgniteUI/igniteui-xplat-examples · GitHub

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
{
  "descriptions": {
    "content": {
      "type": "DataChart",
      "name": "chart",
      "shouldAutoExpandMarginForInitialLabels": true,
      "computedPlotAreaMarginMode": "Series",
      "isVerticalZoomEnabled": false,
      "isHorizontalZoomEnabled": true,
      "brushes": ["green", "red"],
      "outlines": ["green", "red"],
      "plotAreaMarginLeft": 10,
      "plotAreaMarginTop": 0,
      "plotAreaMarginRight": 20,
      "plotAreaMarginBottom": 0,
      "leftMargin": 10,
      "topMargin": 0,
      "rightMargin": 20,
      "bottomMargin": 0,
      "isWindowSyncedToVisibleRange": false,
      "chartTitle": "This Data Chart demonstrates the DataAnnotationRectLayer bound to data that annotates bearish patterns in stock prices.",
      "axes": [
        {
          "type": "CategoryXAxis",
          "name": "xAxis",
          "dataSourceRef": "StockTesla",
          "label": "Date",
          "labelLeftMargin": 0,
          "labelTopMargin": 10,
          "labelRightMargin": 0,
          "labelBottomMargin": 10
        },
        {
          "type": "NumericYAxis",
          "name": "yAxis",
          "minimumValue": 0,
          "maximumValue": 550
        }
      ],
      "series": [
        {
          "type": "FinancialPriceSeries",
          "name": "series1",
          "title": "Stock Price",
          "displayType": "Candlestick",
          "xAxisRef": "xAxis",
          "yAxisRef": "yAxis",
          "dataSourceRef": "StockTesla",
          "openMemberPath": "Open",
          "highMemberPath": "High",
          "lowMemberPath": "Low",
          "closeMemberPath": "Close",
          "showDefaultTooltip": false
        },
        {
          "type": "DataToolTipLayer",
          "name": "Tooltip",
          "includedColumns": ["High", "Low", "Open", "Close"],
          "layoutMode": "Vertical"
        },
        {
          "type": "DataAnnotationRectLayer",
          "name": "RectLayer",
          "dataSourceRef": "AnnotationRectData",
          "targetAxisRef": "xAxis",
          "centerLabelXDisplayMode": "Hidden",
          "startLabelXDisplayMode": "Hidden",
          "endLabelXDisplayMode": "Hidden",
          "startLabelYDisplayMode": "Hidden",
          "endLabelYDisplayMode": "Hidden",
          "actualAreaFillOpacity": 0.1,
          "brush": "purple",
          "outline": "purple",
          "overlayTextColor": "purple",
          "overlayTextVerticalMargin": 20,
          "overlayTextHorizontalMargin": -50,
          "overlayTextLocation": "OutsideBottomCenter",
          "overlayTextMemberPath": "Label",
          "startLabelXMemberPath": "StartLabel",
          "endLabelXMemberPath": "EndLabel",
          "startValueXMemberPath": "StartX",
          "startValueYMemberPath": "StartY",
          "endValueXMemberPath": "EndX",
          "endValueYMemberPath": "EndY"
        }
      ]
    }
  },
  "modules": [
    "charts/DataChartCoreModule",
    "charts/DataChartCategoryModule",
    "charts/DataChartCategoryCoreModule",
    "charts/DataChartFinancialCoreModule",
    "charts/DataChartFinancialModule",
    "charts/DataChartFinancialOverlaysModule",
    "charts/DataChartInteractivityModule",
    "charts/DataChartAnnotationModule",
    "charts/DataAnnotationRectLayerModule",
    "charts/NumberAbbreviatorModule",
    "charts/AnnotationLayerProxyModule"
  ]
}