createIndicator(indicator, isStack?, paneOptions?)

createIndicator create an indicator.

Reference

(
  indicator: string | {
    name: string
    id?: string
    shortName?: string
    precision?: number
    calcParams?: unknown[]
    shouldOhlc?: boolean
    shouldFormatBigNumber?: boolean
    visible?: boolean
    zLevel?: number
    extendData?: unknown
    series?: 'normal' | 'price' | 'volume',
    figures?: Array<{
      key: string
      title?: string
      type?: string
      baseValue?: number
      attrs?: (params: object) => object
      styles?: (params: object) => object
    }>
    minValue?: number
    maxValue?: number
    styles?: Partial<IndicatorStyle>
    shouldUpdate?: (prev: Indicator, current: Indicator) => (boolean | { calc: boolean, draw: boolean })
    calc?: (kLineDataList: KLineData[], indicator: Indicator) => Record<Timestamp, unknown> | Promise<Record<Timestamp, unknown>>
    regenerateFigures?: (calcParams: unknown[]) => Array<{
      key: string
      title?: string
      type?: string
      baseValue?: number
      attrs?: (params: object) => object
      styles?: (params: object) => object
    }>
    createTooltipDataSource?: (params: object) => ({
      name?: string
      calcParamsText?: string
      features?: Array<{
        id?: string
        position?: 'left' | 'middle' | 'right'
        marginLeft?: number
        marginTop?: number
        marginRight?: number
        marginBottom?: number
        paddingLeft?: number
        paddingTop?: number
        paddingRight?: number
        paddingBottom?: number
        size?: number
        color?: string
        activeColor?: string
        backgroundColor?: string
        activeBackgroundColor?: string
        type?: 'path' | 'icon_font'
        path?: {
          style?: 'stroke' | 'fill'
          path?: string
          lineWidth?: number
        }
        iconFont?: {
          content?: string
          family?: string
        }
      }>
      legends?: Array<{
        title: string |
          {
            text: string
            color: string
          }
        value: string |
          {
            text: string
            color: string
          }
      }>
    })
    draw?: (params: object) => boolean
    onDataStateChange?: (params: object) => void
  },
  isStack?: boolean,
  paneOptions: {
    id?: string
    height?: number
    minHeight?: number
    dragEnabled?: boolean
    order?: number
    state?: 'normal' | 'maximize' | 'minimize'
    axis?: {
      name: string
      reverse?: boolean
      inside?: boolean
      position?: 'left' | 'right'
      scrollZoomEnabled?: boolean
      gap?: {
        top?: number
        bottom?: number
      }
      createRange?: (params: object) => ({
        from: number
        to: number
        range: number
        realFrom: number
        realTo: number
        realRange: number
        displayFrom: number
        displayTo: number
        displayRange: number
      })
      createTicks?: (params: object) => Array<{
        coord: number
        value: number | string
        text: string
      }>
    }
  }
) => string | null

Parameters

• indicator Indicator configuration can be an indicator name or an object. The object parameters are as follows.
  • name Name.
  • id Indicator id.
  • shortName A short name, used for prompt display.
  • precision Precision.
  • calcParams Calculate the parameters.
  • shouldOhlc Whether to show the ohlc bar.
  • shouldFormatBigNumber Whether big numbers need to be formatted and displayed.
  • visible Whether it is visible.
  • zLevel Hierarchy only works between indicators.
  • extendData Custom the extended data.
  • series Series, supports normal , price and volume , when price and precision is not set, the precision will follow the price precision, when volume and precision is not set, the precision will follow the volume precision.
  • figures Figure configuration, an array of items containing object configuration.
    • key The identifier of the data value, corresponding to the key of the data sub-item returned by calc.
    • type The type of figure that supports the type returned by klinecharts.getSupportedFigures .
    • baseValue The basic control value, currently only works when type is rect and bar . When this value is valid, the graphics will be drawn up and down based on this value.
    • attrs The property value is a method, and the return value is the required property of the object obtained by klinecharts.getFigureClass .
    • styles Style is a method that returns the style required by the object obtained by klinecharts.getFigureClass .
  • minValue Specify a minimum value.
  • maxValue Specifies the maximum value.
  • styles Style configuration, the type is the same as indicator in the general style Styles.
  • shouldUpdate Control whether updates are needed.
  • calc Calculation method.
  • regenerateFigures Regenerates the basic graphics configuration. This is triggered when calcParams changes. The return value type is the same as figures .
  • createTooltipDataSource Create custom prompts.
  • draw Custom drawing method, if the return value is true, it will override the default drawing.
  • onDataStateChange Data change callback notification.
• isStack Whether to stack.
• paneOptions Pane configuration.
  • id Pane id.
  • height Height.
  • minHeight Min height.
  • dragEnabled Whether the height can be adjusted by dragging.
  • order Order.
  • state State, supports normal , maximize and minimize .
  • axis Axis configuration.
    • name The name of the axis.
    • reverse Whether to reverse.
    • inside Whether it is inside.
    • position Position, supports left and right.
    • scrollZoomEnabled Whether to allow scrolling and zooming.
    • gap Top and bottom margin configuration.
      • top Top margin.
      • bottom Bottom margin.
    • createRange Create an axis value range callback method.
    • createTicks Create ticks information callback method.

Returns

createIndicator returns indicator id string or null .

Usage

Basic usage

Custom indicator

Indicator stack

Setting indicator attrs

Setting pane basic options

Setting pane axis