VerticalAxisConfig

interface VerticalAxisConfig<A extends Annotation, C extends Chart>

An interface that defines the parameters for a call to the verticalAxis rendering function.

Type parameters

  • A: Annotation

  • C: Chart

Properties

annotations

annotations: A []

A list of Annotation objects that will be used to render the glyphs.

axisType

axisType: undefined | Left | Right | GlyphCallback <A, C, Left | Right>

This determines whether the ticks and labels will be placed on the left or the right of the axis.

chart

chart: C

The Chart object in which the glyphs will be rendered.

domain

domain: undefined | None | GlyphCallback <A, C, None>

This defines the domain of the D3 scale used to create the axis glyph.

dominantBaseline

dominantBaseline: undefined | string | GlyphCallback <A, C, string>

How the text aligns vertically: auto, middle, hanging. https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/dominant-baseline

fillColor

fillColor: undefined | string | GlyphCallback <A, C, string>

This defines the fill color of the glyph.

fillOpacity

fillOpacity: undefined | number | GlyphCallback <A, C, number>

This defines the fill opacity of the glyph.

fontFamily

fontFamily: undefined | string | GlyphCallback <A, C, string>

fontSize

fontSize: undefined | number | GlyphCallback <A, C, number>

The font size of the text.

fontStyle

fontStyle: undefined | string | GlyphCallback <A, C, string>

The font style: normal, italic, or oblique. See: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/font-style

fontWeight

fontWeight: undefined | string | GlyphCallback <A, C, string>

The weight of the font: normal, bold, bolder, lighter. See: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/font-weight

height

height: undefined | number | GlyphCallback <A, C, number>

This defines the pixel height of the glyph.

labelFillColor

labelFillColor: undefined | string | GlyphCallback <A, C, string>

This defines fill color of the tick labels on the axis.

labelFillOpacity

labelFillOpacity: undefined | number | GlyphCallback <A, C, number>

This defines the fill opacity of the labels on the axis.

labelStrokeColor

labelStrokeColor: undefined | string | GlyphCallback <A, C, string>

This defines the stroke color of the tick labels on the axis.

labelStrokeOpacity

labelStrokeOpacity: undefined | number | GlyphCallback <A, C, number>

This defines the stroke opacity of the labels on the axis.

labelStrokeWidth

labelStrokeWidth: undefined | number | GlyphCallback <A, C, number>

This defines the stroke width of the tick labels on the axis.

range

range: undefined | None | GlyphCallback <A, C, None>

This defines the range of the D3 scale used to create the axis glyph.

row

row: undefined | number | GlyphCallback <A, C, number>

This defines the row that the glyph is placed in.

rowSpan

rowSpan: undefined | number

The number of bins that the axis will span. This defaults to 1, which forces the axis to fit into one row. If an argument is supplied, it will cause the axis to grow downward. It will have no effect if a custom domain function is supplied.

selector

selector: undefined | string

The string that will be used to uniquely identify the call to the glyph rendering function. In the DOM, the glyphs’ elements will have this assigned as an ID. If the same selector is supplied to two distinct calls to the same glyph function, the rendering results of the first call will be cleared and replaced with the results of the second.

strokeColor

strokeColor: undefined | string | GlyphCallback <A, C, string>

This defines the color of the border around the glyph.

strokeDashArray

strokeDashArray: undefined | string | GlyphCallback <A, C, string>

This defines the stroke dash array of the glyph. See https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray

strokeDashOffset

strokeDashOffset: undefined | string | GlyphCallback <A, C, string>

This defines the offset for the stroke dash array (if supplied) of the glyph. See https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dashoffset

strokeLineCap

strokeLineCap: undefined | string | GlyphCallback <A, C, string>

This defines the stroke linecap of the glyph. See https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linecap

strokeLineJoin

strokeLineJoin: undefined | string | GlyphCallback <A, C, string>

This defines the offset for the stroke linejoin of the glyph. See https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linejoin

strokeOpacity

strokeOpacity: undefined | number | GlyphCallback <A, C, number>

This defines the opacity of the border around the glyph.

strokeWidth

strokeWidth: undefined | number | GlyphCallback <A, C, number>

This defines the width of the border around the glyph.

target

target: undefined | Selection <any, any, any, any> | Viewport | Overflow | Defs

This determines the parent DOM element in which the glyphs will be rendered. When supplying a BindTarget, the rendering function will find the appropriate parent in the supplied Chart. When supplying a D3 selection, the rendering function will explicitly use the selected element.

textAnchor

textAnchor: undefined | string | GlyphCallback <A, C, string>

How the text aligns horizontally: start, middle, or end. See: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/text-anchor

tickFillColor

tickFillColor: undefined | string | GlyphCallback <A, C, string>

This defines the fill color of the tick marks on the axis

tickFillOpacity

tickFillOpacity: undefined | string | GlyphCallback <A, C, string>

This defines the fill opacity of the tick marks on the axis.

tickFormat

tickFormat: undefined | string | GlyphCallback <A, C, string>

This controls the tick count and format of the tick labels. For more information, see: https://github.com/d3/d3-axis#axis_ticks

tickPadding

tickPadding: undefined | number | GlyphCallback <A, C, number>

This controls the distance between the tick marks and tick labels. For more information, see: https://github.com/d3/d3-axis#axis_tickPadding

tickSizeInner

tickSizeInner: undefined | number | GlyphCallback <A, C, number>

This controls the size of the “inner” axis ticks. For more information, see: https://github.com/d3/d3-axis#axis_tickSizeInner

tickSizeOuter

tickSizeOuter: undefined | number | GlyphCallback <A, C, number>

This controls the size of the “outer” axis ticks. For more information, see: https://github.com/d3/d3-axis#axis_tickSizeOuter

tickStrokeColor

tickStrokeColor: undefined | string | GlyphCallback <A, C, string>

This defines the stroke color of the tick marks on the axis.

tickStrokeOpacity

tickStrokeOpacity: undefined | number | GlyphCallback <A, C, number>

This defines the stroke opacity of the tick marks on the axis.

tickStrokeWidth

tickStrokeWidth: undefined | number | GlyphCallback <A, C, number>

This defines the stroke width of the tick marks on the axis.

ticks

ticks: undefined | number | GlyphCallback <A, C, number>

This defines the tick property that will be passed to D3’s axis.ticks function. For more information, see https://github.com/d3/d3-axis#axis_ticks

width

width: undefined | number | GlyphCallback <A, C, number>

This defines the pixel width of the glyph.

x

x: undefined | number | GlyphCallback <A, C, number>

This defines the pixel x coordinate of the glyph.

y

y: undefined | number | GlyphCallback <A, C, number>

This defines the pixel y coordinate of the glyph