Vue ChartsPie and Doughnut Series

title: AgPieTitleOptions;

interface AgPieTitleOptions {
  showInLegend?: boolean;
  // Whether or not the text should be shown. 
  enabled?: boolean;
  // The text to display. 
  text?: string;
  // The font style to use for the text. 
  fontStyle?: FontStyle;
  // The font weight to use for the text. 
  fontWeight?: FontWeight;
  // The font size in pixels to use for the text. 
  fontSize?: FontSize;
  // The font family to use for the text. 
  fontFamily?: FontFamily;
  // The colour to use for the text. 
  color?: CssColor;
  // Spacing added to help position the text. 
  spacing?: number;
}

type FontStyle = 
      'normal' 
    | 'italic' 
    | 'oblique'


type FontWeight = 
      'normal' 
    | 'bold' 
    | 'bolder' 
    | 'lighter' 
    | '100' 
    | '200' 
    | '300' 
    | '400' 
    | '500' 
    | '600' 
    | '700' 
    | '800' 
    | '900'


type FontSize = number

type FontFamily = string

type CssColor = string

calloutLabel: AgPieSeriesLabelOptions<DatumType>;

interface AgPieSeriesLabelOptions<DatumType> {
  // Distance in pixels between the callout line and the label text. 
  offset?: PixelSize;
  // Minimum angle in degrees required for a sector to show a label. 
  minAngle?: number;
  // A function that allows the modification of the label text based on input parameters. 
  formatter?: (params: AgPieSeriesLabelFormatterParams<DatumType>) => string;
  // Whether or not the labels should be shown. 
  enabled?: boolean;
  // The font style to use for the labels. 
  fontStyle?: FontStyle;
  // The font weight to use for the labels. 
  fontWeight?: FontWeight;
  // The font size in pixels to use for the labels. 
  fontSize?: FontSize;
  // The font family to use for the labels. 
  fontFamily?: FontFamily;
  // The colour to use for the labels. 
  color?: CssColor;
}

type PixelSize = number

interface AgPieSeriesLabelFormatterParams<DatumType> {
  // Datum from the series data array that the label is being rendered for. 
  datum: DatumType;
  // calloutLabelKey as specified on series options. 
  calloutLabelKey?: string;
  // calloutLabelValue as read from series data via the calloutLabelKey property. 
  calloutLabelValue?: string;
  // calloutLabelName as specified on series options. 
  calloutLabelName?: string;
  // sectorLabelKey as specified on series options. 
  sectorLabelKey?: string;
  // sectorLabelValue as read from series data via the sectorLabelKey property. 
  sectorLabelValue?: string;
  // sectorLabelName as specified on series options. 
  sectorLabelName?: string;
  // angleKey as specified on series options. 
  angleKey: string;
  // angleValue as read from series data via the angleKey property. 
  angleValue?: any;
  // angleName as specified on series options. 
  angleName?: string;
  // radiusKey as specified on series options. 
  radiusKey?: string;
  // radiusValue as read from series data via the radiusKey property. 
  radiusValue?: any;
  // radiusName as specified on series options. 
  radiusName?: string;
  // The ID of the series. 
  seriesId: string;
}

type FontStyle = 
      'normal' 
    | 'italic' 
    | 'oblique'


type FontWeight = 
      'normal' 
    | 'bold' 
    | 'bolder' 
    | 'lighter' 
    | '100' 
    | '200' 
    | '300' 
    | '400' 
    | '500' 
    | '600' 
    | '700' 
    | '800' 
    | '900'


type FontSize = number

type FontFamily = string

type CssColor = string

sectorLabel: AgPieSeriesSectorLabelOptions<DatumType>;

interface AgPieSeriesSectorLabelOptions<DatumType> {
  // Distance in pixels, used to make the label text closer to or further from the center. This offset is applied after positionRatio. 
  positionOffset?: PixelSize;
  // Position of labels as a ratio proportional to pie radius (or doughnut thickness). Additional offset in pixels can be applied by using positionOffset. 
  positionRatio?: Ratio;
  // A function that allows the modification of the label text based on input parameters. 
  formatter?: (params: AgPieSeriesLabelFormatterParams<DatumType>) => string;
  // Whether or not the labels should be shown. 
  enabled?: boolean;
  // The font style to use for the labels. 
  fontStyle?: FontStyle;
  // The font weight to use for the labels. 
  fontWeight?: FontWeight;
  // The font size in pixels to use for the labels. 
  fontSize?: FontSize;
  // The font family to use for the labels. 
  fontFamily?: FontFamily;
  // The colour to use for the labels. 
  color?: CssColor;
}

type PixelSize = number

type Ratio = number

interface AgPieSeriesLabelFormatterParams<DatumType> {
  // Datum from the series data array that the label is being rendered for. 
  datum: DatumType;
  // calloutLabelKey as specified on series options. 
  calloutLabelKey?: string;
  // calloutLabelValue as read from series data via the calloutLabelKey property. 
  calloutLabelValue?: string;
  // calloutLabelName as specified on series options. 
  calloutLabelName?: string;
  // sectorLabelKey as specified on series options. 
  sectorLabelKey?: string;
  // sectorLabelValue as read from series data via the sectorLabelKey property. 
  sectorLabelValue?: string;
  // sectorLabelName as specified on series options. 
  sectorLabelName?: string;
  // angleKey as specified on series options. 
  angleKey: string;
  // angleValue as read from series data via the angleKey property. 
  angleValue?: any;
  // angleName as specified on series options. 
  angleName?: string;
  // radiusKey as specified on series options. 
  radiusKey?: string;
  // radiusValue as read from series data via the radiusKey property. 
  radiusValue?: any;
  // radiusName as specified on series options. 
  radiusName?: string;
  // The ID of the series. 
  seriesId: string;
}

type FontStyle = 
      'normal' 
    | 'italic' 
    | 'oblique'


type FontWeight = 
      'normal' 
    | 'bold' 
    | 'bolder' 
    | 'lighter' 
    | '100' 
    | '200' 
    | '300' 
    | '400' 
    | '500' 
    | '600' 
    | '700' 
    | '800' 
    | '900'


type FontSize = number

type FontFamily = string

type CssColor = string

calloutLine: AgPieSeriesCalloutOptions;

interface AgPieSeriesCalloutOptions {
  // The colours to cycle through for the strokes of the callouts. 
  colors?: CssColor[];
  // The length in pixels of the callout lines. 
  length?: PixelSize;
  // The width in pixels of the stroke for callout lines. 
  strokeWidth?: PixelSize;
}

type CssColor = string

type PixelSize = number

fills: CssColor[];

type CssColor = string

strokes: CssColor[];

type CssColor = string

fillOpacity: Opacity;

type Opacity = number

strokeOpacity: Opacity;

type Opacity = number

strokeWidth: PixelSize;

type PixelSize = number

lineDash: PixelSize[];

type PixelSize = number

lineDashOffset: PixelSize;

type PixelSize = number

outerRadiusOffset: PixelSize;

type PixelSize = number

outerRadiusRatio: Ratio;

type Ratio = number

innerRadiusOffset: PixelSize;

type PixelSize = number

innerRadiusRatio: Ratio;

type Ratio = number

shadow: AgDropShadowOptions;

interface AgDropShadowOptions {
  // Whether or not the shadow is visible. 
  enabled?: boolean;
  // The colour of the shadow. 
  color?: CssColor;
  // The horizontal offset in pixels for the shadow. 
  xOffset?: PixelSize;
  // The vertical offset in pixels for the shadow. 
  yOffset?: PixelSize;
  // The radius of the shadow's blur, given in pixels. 
  blur?: PixelSize;
}

type CssColor = string

type PixelSize = number

tooltip: AgPieSeriesTooltip;

interface AgPieSeriesTooltip {
  // Function used to create the content for tooltips. 
  renderer?: (params: AgPieSeriesTooltipRendererParams) => string | AgTooltipRendererResult;
  // Whether or not to show tooltips when the series are hovered over. 
  enabled?: boolean;
  // The position of the tooltip. By default the tooltip follows the mouse pointer. 
  position?: AgTooltipPositionOptions;
  // Configuration for tooltip interaction. 
  interaction?: AgSeriesTooltipInteraction;
}

interface AgPieSeriesTooltipRendererParams {
  // calloutLabelKey as specified on series options. 
  calloutLabelKey?: string;
  // calloutLabelName as specified on series options. 
  calloutLabelName?: string;
  // sectorLabelKey as specified on series options. 
  sectorLabelKey?: string;
  // sectorLabelName as specified on series options. 
  sectorLabelName?: string;
  // angleKey as specified on series options. 
  angleKey: string;
  // angleValue as read from series data via the angleKey property. 
  angleValue?: any;
  // angleName as specified on series options. 
  angleName?: string;
  // radiusKey as specified on series options. 
  radiusKey?: string;
  // radiusValue as read from series data via the radiusKey property. 
  radiusValue?: any;
  // radiusName as specified on series options. 
  radiusName?: string;
  // Datum from the series data array that the tooltip is being rendered for. 
  datum: any;
  // Series title or yName depending on series configuration. 
  title?: string;
  // Series primary colour, as selected from the active theme, series options or formatter. 
  color?: CssColor;
  // The ID of the series. 
  seriesId: string;
}

type CssColor = string

interface AgTooltipRendererResult {
  // Title text for the tooltip header. 
  title?: string;
  // Content text for the tooltip body. 
  content?: string;
  // Tooltip title text color. 
  color?: string;
  // Tooltip title background color. 
  backgroundColor?: string;
}

type AgTooltipPositionOptions = 
      AgMovingTooltipPositionOptions


interface AgMovingTooltipPositionOptions {
  // The type of positioning for the tooltip. By default, the tooltip follows the pointer. 
  type: AgTooltipPositionType;
  // The horizontal offset in pixels for the position of the tooltip. 
  xOffset?: PixelSize;
  // The vertical offset in pixels for the position of the tooltip. 
  yOffset?: PixelSize;
}

type AgTooltipPositionType = 'pointer' | 'node'

type PixelSize = number

interface AgSeriesTooltipInteraction {
  // Set to true to keep the tooltip open when the mouse is hovering over it, and enable clicking tooltip text 
  enabled: boolean;
}

innerLabels: AgDoughnutInnerLabel[];

interface AgDoughnutInnerLabel {
  // The text to show in the inner label. 
  text: string;
  // The font style to use for the inner label. 
  fontStyle?: FontStyle;
  // The font weight to use for the inner label. 
  fontWeight?: FontWeight;
  // The font size in pixels to use for the inner label. 
  fontSize?: FontSize;
  // The font family to use for the inner label. 
  fontFamily?: FontFamily;
  // The colour to use for the inner label. 
  color?: CssColor;
  // The margin in pixels before and after the inner label. 
  margin?: PixelSize;
}

type FontStyle = 
      'normal' 
    | 'italic' 
    | 'oblique'


type FontWeight = 
      'normal' 
    | 'bold' 
    | 'bolder' 
    | 'lighter' 
    | '100' 
    | '200' 
    | '300' 
    | '400' 
    | '500' 
    | '600' 
    | '700' 
    | '800' 
    | '900'


type FontSize = number

type FontFamily = string

type CssColor = string

type PixelSize = number

innerCircle: AgDoughnutInnerCircle;

interface AgDoughnutInnerCircle {
  // The colour of the fill for the inner circle. 
  fill: CssColor;
  // The opacity of the fill for the inner circle. 
  fillOpacity?: Opacity;
}

type CssColor = string

type Opacity = number

formatter = (
    params: AgPieSeriesFormatterParams<DatumType>
) => AgPieSeriesFormat;

interface AgPieSeriesFormatterParams<DatumType> {
  datum: DatumType;
  fill?: CssColor;
  stroke?: CssColor;
  strokeWidth: PixelSize;
  highlighted: boolean;
  angleKey: string;
  radiusKey?: string;
  sectorLabelKey?: string;
  seriesId: string;
}

type CssColor = string

type PixelSize = number

interface AgPieSeriesFormat {
  fill?: CssColor;
  fillOpacity?: Opacity;
  stroke?: CssColor;
  strokeWidth?: PixelSize;
}

type Opacity = number

listeners: AgSeriesListeners<DatumType>;

interface AgSeriesListeners<DatumType> {
  // The listener to call when a node (marker, column, bar, tile or a pie sector) in the series is clicked. 
  nodeClick?: (params: AgSeriesNodeClickParams<DatumType>) => void;
  // The listener to call when a node (marker, column, bar, tile or a pie sector) in the series is double clicked. 
  nodeDoubleClick?: (params: AgSeriesNodeClickParams<DatumType>) => void;
}

interface AgSeriesNodeClickParams<DatumType> {
  // Event type. 
  type: 'nodeClick';
  // Series ID, as specified in series.id (or generated if not specified) 
  seriesId: string;
  // Datum from the series data array. 
  datum: DatumType;
  // xKey as specified on series options 
  xKey?: string;
  // yKey as specified on series options 
  yKey?: string;
  // sizeKey as specified on series options 
  sizeKey?: string;
  // labelKey as specified on series options 
  labelKey?: string;
  // colorKey as specified on series options 
  colorKey?: string;
  // angleKey as specified on series options 
  angleKey?: string;
  // calloutLabelKey as specified on series options 
  calloutLabelKey?: string;
  // sectorLabelKey as specified on series options 
  sectorLabelKey?: string;
  // radiusKey as specified on series options 
  radiusKey?: string;
}

highlightStyle: AgSeriesHighlightStyle;

interface AgSeriesHighlightStyle {
  // Highlight style used for an individual marker when tapped or hovered over. 
  item?: AgSeriesHighlightMarkerStyle;
  // Highlight style used for whole series when one of its markers is tapped or hovered over. 
  series?: AgSeriesHighlightSeriesStyle;
}

interface AgSeriesHighlightMarkerStyle {
  // The fill colour of a marker when tapped or hovered over. Use `undefined` for no highlight. 
  fill?: CssColor;
  // The opacity of the fill for the highlighted item. 
  fillOpacity?: Opacity;
  // The stroke colour of a marker when tapped or hovered over. Use `undefined` for no highlight. 
  stroke?: CssColor;
  // The stroke width of a marker when tapped or hovered over. Use `undefined` for no highlight. 
  strokeWidth?: PixelSize;
}

type CssColor = string

type Opacity = number

type PixelSize = number

interface AgSeriesHighlightSeriesStyle {
  enabled?: boolean;
  // The opacity of the whole series (area line, area fill, labels and markers, if any) when another chart series or another stack level in the same area series is highlighted by hovering a data point or a legend item. Use `undefined` or `1` for no dimming. 
  dimOpacity?: Opacity;
  // The stroke width of the area line when one of the markers is tapped or hovered over, or when a tooltip is shown for a data point, even when series markers are disabled. Use `undefined` for no highlight. 
  strokeWidth?: PixelSize;
}

nodeClickRange: AgChartInteractionRange;

type AgChartInteractionRange = 
      PixelSize 
    | 'exact' 
    | 'nearest'


type PixelSize = number