React Charts: Area Series

marker: AgCartesianSeriesMarker;

interface AgCartesianSeriesMarker {
  // Function used to return formatting for individual markers, based on the supplied information. If the current marker is highlighted, the `highlighted` property will be set to `true`; make sure to check this if you want to differentiate between the highlighted and un-highlighted states. 
  formatter?: AgCartesianSeriesMarkerFormatter;
  // Whether or not to show markers. 
  enabled?: boolean;
  // The shape to use for the markers. You can also supply a custom marker by providing a `Marker` subclass. 
  shape?: string | (new () => any);
  // The size in pixels of the markers. 
  size?: number;
  // For series where the size of the marker is determined by the data, this determines the largest size a marker can be in pixels. 
  maxSize?: number;
  // The colour to use for marker fills. If this is not specified, the markers will take their fill from the series. 
  fill?: string;
  // The colour to use for marker strokes. If this is not specified, the markers will take their stroke from the series. 
  stroke?: string;
  // The width in pixels of the marker stroke. If this is not specified, the markers will take their stroke width from the series. 
  strokeWidth?: number;
  // 
  fillOpacity?: number;
  // 
  strokeOpacity?: number;
}

type AgCartesianSeriesMarkerFormatter = 
      (params: AgCartesianSeriesMarkerFormatterParams) => AgCartesianSeriesMarkerFormat 
    | undefined


interface AgCartesianSeriesMarkerFormatterParams {
  xKey: string;
  yKey: string;
  datum: any;
  fill?: string;
  stroke?: string;
  strokeWidth: number;
  size: number;
  highlighted: boolean;
}

interface AgCartesianSeriesMarkerFormat {
  fill?: string;
  stroke?: string;
  strokeWidth?: number;
  size?: number;
}

shadow: AgDropShadowOptions;

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

label: AgAreaSeriesLabelOptions;

interface AgAreaSeriesLabelOptions {
  // Function used to turn 'yKey' values into text to be displayed by a label. Be default the values are simply stringified. 
  formatter?: (params: { value: any; }) => 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?: number;
  // The font family to use for the labels. 
  fontFamily?: string;
  // The colour to use for the labels. 
  color?: string;
}

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


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

tooltip: AgAreaSeriesTooltip;

interface AgAreaSeriesTooltip {
  renderer?: (params: AgCartesianSeriesTooltipRendererParams) => string | AgTooltipRendererResult;
  format?: string;
  // Whether or not to show tooltips when the series are hovered over. 
  enabled?: boolean;
}

interface AgCartesianSeriesTooltipRendererParams {
  xKey: string;
  xValue?: any;
  xName?: string;
  yKey: string;
  yValue?: any;
  yName?: string;
  datum: any;
  title?: string;
  color?: string;
}

interface AgTooltipRendererResult {
  title?: string;
  content?: string;
}

listeners: AgBaseSeriesListeners | {[key: string]: Function};

interface AgBaseSeriesListeners {
  // The listener to call when a node (marker, column, bar, tile or a pie slice) in the series is clicked. 
  nodeClick: (params: { type: 'nodeClick'; series: any; datum: any; xKey: string; yKey: string; }) => any;
}

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?: string;
  // The stroke colour of a marker when tapped or hovered over. Use `undefined` for no highlight. 
  stroke?: string;
  // The stroke width of a marker when tapped or hovered over. Use `undefined` for no highlight. 
  strokeWidth?: 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?: number;
  // 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?: number;
}