@fluentui/react-charting 5.24.2 → 5.24.4

package/src/components/CommonComponents/CartesianChart.types.ts

@@ -6,6 +6,7 @@ import { IFocusZoneProps, FocusZoneDirection } from '@fluentui/react-focus';
 import { ICalloutProps } from '@fluentui/react/lib/Callout';
 import { ILegendsProps } from '../Legends/index';
 import {
+  AxisCategoryOrder,
   IAccessibilityProps,
   IChart,
   IDataPoint,
@@ -14,6 +15,7 @@ import {
   IHorizontalBarChartWithAxisDataPoint,
   ILineChartPoints,
   IMargins,
+  IScatterChartDataPoint,
   IVerticalBarChartDataPoint,
   IVerticalStackedBarDataPoint,
 } from '../../types/index';
@@ -159,10 +161,15 @@ export interface ICartesianChartStyles {
   tooltip?: IStyle;
 
   /**
-   * styles for tooltip
+   * styles for axis title
    */
   axisTitle?: IStyle;
 
+  /**
+   * styles for axis annotation
+   */
+  axisAnnotation?: IStyle;
+
   /**
    * Style for the chart Title.
    */
@@ -182,6 +189,11 @@ export interface ICartesianChartStyles {
    * Styles for the chart wrapper div
    */
   chartWrapper?: IStyle;
+
+  /**
+   * Styles for the svg tooltip
+   */
+  svgTooltip?: IStyle;
 }
 
 /**
@@ -469,6 +481,32 @@ export interface ICartesianChartProps {
    * @default false
    */
   hideTickOverlap?: boolean;
+
+  /**
+   * Prop to set the x axis annotation. Used to display additional information on the x-axis.
+   * This is shown on the top of the chart.
+   * @default undefined
+   */
+  xAxisAnnotation?: string;
+
+  /**
+   * Prop to set the y axis annotation. Used to display additional information on the y-axis.
+   * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.
+   * @default undefined
+   */
+  yAxisAnnotation?: string;
+
+  /**
+   * Specifies the ordering logic for categories (or string tick labels) on the x-axis.
+   * @default 'default'
+   */
+  xAxisCategoryOrder?: AxisCategoryOrder;
+
+  /**
+   * Specifies the ordering logic for categories (or string tick labels) on the y-axis.
+   * @default 'default'
+   */
+  yAxisCategoryOrder?: AxisCategoryOrder;
 }
 
 export interface IYValueHover {
@@ -671,7 +709,12 @@ export interface IModifiedCartesianChartProps extends ICartesianChartProps {
    * Get the min and max values of the y-axis
    */
   getMinMaxOfYAxis: (
-    points: ILineChartPoints[] | IHorizontalBarChartWithAxisDataPoint[] | IVerticalBarChartDataPoint[] | IDataPoint[],
+    points:
+      | ILineChartPoints[]
+      | IHorizontalBarChartWithAxisDataPoint[]
+      | IVerticalBarChartDataPoint[]
+      | IDataPoint[]
+      | IScatterChartDataPoint[],
     yAxisType: YAxisType | undefined,
     useSecondaryYScale?: boolean,
   ) => { startValue: number; endValue: number };

package/src/components/ScatterChart/ScatterChart.types.ts

@@ -0,0 +1,67 @@
+/* eslint-disable @typescript-eslint/naming-convention */
+import { IRenderFunction } from '@fluentui/react/lib/Utilities';
+import {
+  IChartProps,
+  ILineChartPoints,
+  IMargins,
+  IBasestate,
+  IRefArrayData,
+  ICustomizedCalloutData,
+} from '../../types/index';
+import {
+  ICartesianChartProps,
+  ICartesianChartStyleProps,
+  ICartesianChartStyles,
+  IChildProps,
+} from '../CommonComponents/index';
+import { IStyle } from '@fluentui/react';
+
+export type { IChildProps, ILineChartPoints, IMargins, IBasestate, IRefArrayData };
+
+/**
+ * Line Chart properties
+ * {@docCategory LineChart}
+ */
+export interface IScatterChartProps extends ICartesianChartProps {
+  /**
+   * Data to render in the chart.
+   */
+  data: IChartProps;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  styles?: IScatterChartStyles;
+
+  /**
+   * Define a custom callout renderer for a data point
+   */
+  onRenderCalloutPerDataPoint?: IRenderFunction<ICustomizedCalloutData>;
+
+  /**
+   * Callback for getting callout description message
+   */
+  getCalloutDescriptionMessage?: (calloutDataProps: ICustomizedCalloutData) => string | undefined;
+
+  /**
+   * The prop used to define the culture to localized the numbers
+   */
+  culture?: string;
+}
+
+/**
+ * Scatter Chart styles
+ * {@docCategory ScatterChart}
+ */
+export interface IScatterChartStyles extends ICartesianChartStyles {
+  /**
+   * Style for the marker label
+   */
+  markerLabel?: IStyle;
+}
+
+/**
+ * Scatter Chart style properties
+ * {@docCategory ScatterChart}
+ */
+export interface IScatterChartStyleProps extends ICartesianChartStyleProps {}