add time axis sample

samples/charts/data-chart/_timeline-axis-type.json

@@ -0,0 +1,92 @@
+{
+  "export": false,
+  "strings": {
+    "legendTitle": "Brexit Timeline"
+  },
+  "descriptions": {
+    "content": {
+      "type": "DataChart",
+      "name": "chart",
+      "axes": [
+        {
+          "type": "CategoryXAxis",
+          "name": "xAxis",
+          "dataSourceRef": "data",
+          "label": "Year",
+          "labelLocation": "OutsideBottom"
+        },
+        {
+          "type": "TimeXAxis",
+          "name": "tAxis",
+          "dataSourceRef": "data",
+          "dateTimeMemberPath": "Year",
+          "labelLocation": "OutsideBottom"
+        },
+        {
+          "type": "NumericYAxis",
+          "name": "yAxis",
+          "title": "TWh",
+          "labelLocation": "OutsideRight"
+        }
+      ],
+      "series": [
+        {
+          "type": "LineSeries",
+          "name": "LineSeries1",
+          "title": "Brexit Timeline",
+          "xAxisRef": "xAxis",
+          "yAxisRef": "yAxis",
+          "dataSourceRef": "data",
+          "valueMemberPath": "Value",
+          "markerType": "Circle"
+        },
+        {
+          "type": "CalloutLayer",
+          "name": "CalloutLayer1",
+          "targetSeriesRef": "LineSeries1",
+          "dataSourceRef": "data",
+          "xMemberPath": "Index",
+          "yMemberPath": "Value",
+          "labelMemberPath": "Year",
+          "isAutoCalloutBehaviorEnabled": false,
+          "useValueForAutoCalloutLabels": false,
+          "calloutLeaderBrush": "#EC0D00",
+          "calloutTextColor": "navy",
+          "calloutOutline": "#EC0D00",
+          "calloutBackground": "transparent",
+          "isCalloutOffsettingEnabled": false,
+          "textStyle": "font-size: 0.8rem",
+          "calloutPositionPadding": 50,
+          "calloutCollisionMode": "Greedy",
+          "showDefaultTooltip": false
+        }
+      ],
+      "legendRef": null,
+      "background": "rgba(0, 0, 0, 0)"
+    }
+  },
+  "refs": {
+    "data": [
+      { "Index": 0, "Date": "2016, 6, 23", "Year": "23 JUN, 2016", "Value": 5, "Details": "UK votes to exit the EU"},
+      { "Index": 1, "Date": "2017, 3, 29", "Year": "29 MAR, 2017", "Value": 5, "Details": "The UK triggers Article 50"},
+      { "Index": 2, "Date": "2017, 6, 19", "Year": "19 JUN, 2017", "Value": 5, "Details": "Brexit negotiations begin"},
+      { "Index": 3, "Date": "2017, 3, 19", "Year": "19 MAR, 2018", "Value": 5, "Details": "The EU and the UK agree on a transition phase"},
+      { "Index": 4, "Date": "2018, 11, 25", "Year": "25 NOV, 2018", "Value": 5, "Details": "Draft withdrawl deal agreed"},
+      { "Index": 5, "Date": "2019, 10, 29", "Year": "29 OCT, 2019", "Value": 5, "Details": "EU heads of state and government approve postponing the Brexit date"},
+      { "Index": 6, "Date": "2020, 12, 31", "Year": "31 DEC, 2020", "Value": 5, "Details": "Transition period ends"}
+    ]
+  },
+  "modules": [
+    "withDescriptions",
+    "charts/DataChartCoreModule",
+    "charts/DataChartCategoryCoreModule",
+    "charts/DataChartCategoryModule",
+    "charts/DataChartVerticalCategoryModule",
+    "charts/TimeXAxisModule",
+    "charts/DataChartInteractivityModule",
+    "charts/DataChartExtendedAxesModule",
+    "charts/DataChartAnnotationModule",
+    "charts/AnnotationLayerProxyModule",
+    "charts/CalloutLayerModule"
+  ]
+}

samples/charts/data-chart/_timeline-axis-with-callout.json

@@ -0,0 +1,68 @@
+{
+  "export": false,
+  "descriptions": {
+    "content": {
+      "type": "DataChart",
+      "name": "chart",
+      "isHorizontalZoomEnabled": true,
+      "isVerticalZoomEnabled": true,
+      "plotAreaMarginLeft": 100,
+      "plotAreaMarginRight": 100,
+      "axes": [
+        {
+          "type": "CategoryXAxis",
+          "name": "xAxis",
+          "dataSourceRef": "MyTimelineData",
+          "label": "Label"
+        },
+        {
+          "type": "TimeXAxis",
+          "name": "tAxis",
+          "dataSourceRef": "MyTimelineData",
+          "dateTimeMemberPath": "Date",
+          "labelLocation": "OutsideBottom"
+        },
+        {
+          "type": "NumericYAxis",
+          "name": "yAxis"
+        }
+      ],
+      "series": [
+        {
+          "type": "LineSeries",
+          "name": "LineSeries1",
+          "xAxisRef": "xAxis",
+          "yAxisRef": "yAxis",
+          "dataSourceRef": "MyTimelineData",
+          "valueMemberPath": "Value"
+        },
+        {
+          "type": "CalloutLayer",
+          "name": "CalloutLayer1",
+          "targetSeriesRef": "LineSeries1",
+          "dataSourceRef": "MyTimelineData",
+          "xMemberPath": "Index",
+          "yMemberPath": "Value",
+          "labelMemberPath": "Label",
+          "isAutoCalloutBehaviorEnabled": false,
+          "useValueForAutoCalloutLabels": false,
+          "calloutLeaderBrush": "#EC0D00",
+          "calloutTextColor": "navy",
+          "calloutOutline": "#EC0D00",
+          "calloutBackground": "transparent",
+          "isCalloutOffsettingEnabled": false,
+          "textStyle": "10pt Verdana",
+          "calloutPositionPadding": 50,
+          "calloutCollisionMode": "Greedy",
+          "showDefaultTooltip": false
+        }
+      ]
+    }
+  },
+  "modules": [
+    "withDescriptions",
+    "layouts/PropertyEditorPanelModule",
+    "charts/DataChartCategoryModule",
+    "charts/DataChartInteractivityModule"
+  ]
+}

samples/charts/data-chart/axis-time-format.json

@@ -0,0 +1,68 @@
+{
+  "issue1": "axis interval does not update when axis visible range is changed to less than 365 days",
+  "issue2": "axis label format does not update when axis visible range is changed to less than 365 days",
+  "note": "added additional CategoryXAxis as reference for verifying format and interval of TimeXAXis",
+  "export": false,
+  "descriptions": {
+    "content": {
+      "type": "DataChart",
+      "name": "chart",
+      "isHorizontalZoomEnabled": true,
+      "isVerticalZoomEnabled": false,
+      "plotAreaMarginLeft": 20,
+      "plotAreaMarginRight": 20,
+      "axes": [
+        {
+          "type": "CategoryXAxis",
+          "name": "xAxis",
+          "dataSourceRef": "HistoricalStockTSLA",
+          "enhancedIntervalPreferMoreCategoryLabels": true,
+          "useEnhancedIntervalManagement": true,
+          "labelTextColor": "black",
+          "label": "Label"
+        },
+        {
+          "type": "TimeXAxis",
+          "name": "tAxis",
+          "dataSourceRef": "HistoricalStockTSLA",
+          "dateTimeMemberPath": "Date",
+          "labelTextColor": "red",
+          "labelLocation": "OutsideBottom",
+          "enhancedIntervalPreferMoreCategoryLabels": true,
+          "useEnhancedIntervalManagement": true,
+          "labelFormats": [
+            {"type": "TimeAxisLabelFormat", "range": 500, "format": "yyyy" },
+            {"type": "TimeAxisLabelFormat", "range": 365, "format": "MMM yy" }
+          ],
+          "intervals": [
+            { "type": "TimeAxisInterval", "range": 500, "interval": 1, "intervalType": "Years" },
+            { "type": "TimeAxisInterval", "range": 365, "interval": 1, "intervalType": "Months" },
+            { "type": "TimeAxisInterval", "range": 100, "interval": 30, "intervalType": "Days" }
+          ]
+        },
+        {
+          "type": "NumericYAxis",
+          "name": "yAxis"
+        }
+      ],
+      "series": [
+        {
+          "type": "LineSeries",
+          "name": "LineSeries1",
+          "xAxisRef": "xAxis",
+          "yAxisRef": "yAxis",
+          "dataSourceRef": "HistoricalStockTSLA",
+          "valueMemberPath": "Close",
+          "markerType": "None"
+        }
+      ]
+    }
+  },
+  "modules": [
+    "charts/TimeXAxisModule",
+    "charts/TimeAxisLabelFormatModule",
+    "charts/DataChartCategoryModule",
+    "charts/DataChartExtendedAxesModule",
+    "charts/DataChartInteractivityModule"
+  ]
+}