RacingCounterTexts

• Name: Racing Counter Texts

• Description: Mainly used with RacingBars to display counter texts.

• Usage: The text corresponds to dataFormatter.xAxis.valueLabels[], displaying the text corresponding to the current counter number in the valueLabels[] array. If valueLabels[] is not set, it will default to displaying numbers from 0 to the last value.

• Playground Example

params$

• Type: Partial<RacingCounterTextsParams>

• Fields:

  Name	Description	Type
  renderFn	Function to display text, returns an array for multiline text	(valueLabel: string, valueIndex: number, data: ComputedDataMultiValue) => string[] | string
  textAttrs	Attributes for each line of text	Array<{ [key:string]: string | number }>
  textStyles	Styles for each line of text	Array<{ [key:string]: string | number }>
  paddingRight	Right padding	number
  paddingBottom	Bottom padding	number

Detailed Types

export type ComputedDataMultiValue = ComputedDatumMultiValue[][]

interface ComputedDatumMultiValue {
  id: string
  index: number
  label: string
  visible: boolean
  data: any
  datumIndex: number
  value: number[]
  color: string
  categoryIndex: number
  categoryLabel: string
}

• Default values:

{
  renderFn: (valueLabel: string, valueIndex: number, data: ComputedDataTypeMap<'multiValue'>) => {
    return valueLabel
  },
  textAttrs: [
    {
      "transform": "translate(0, 0)"
    }
  ],
  textStyles: [
    {
      "font-weight": "bold",
      "text-anchor": "end",
      "pointer-events": "none",
      "dominant-baseline": "auto",
      "font-size": 64,
      "fill": "#bebebe"
    },
    {
      "text-anchor": "end",
      "pointer-events": "none",
      "dominant-baseline": "auto",
      "font-size": 24,
      "fill": "#bebebe"
    },
  ],
  paddingRight: 0,
  paddingBottom: 0
}