Creates an arrow. The dimensions are set with the "width" and "height" styles.

If you set the height to 0 for a vertical arrow or the width to 0 for a horizontal arrow you get a chevron. Use the offset properties to adjust the center of the arrow/chevron.

Properties

angle: string

The degree of the pointer strokes to each other. Default is "90deg"; Can also be set through --hylo-glyph-arrow-angle.

flip: boolean

Flips the arrow by 180°.

height: string

The height as css style or as an JSON object of css styles. The object can contain the keys 'default', 'xl', 'lg', 'md', 'sm', 'xs'. A hylo-breakpoint-listener has to be present. e.g. {"default": "20px", "xs": "15px", "sm": "15px"}

Can also be set as --hylo-glyph-height.

horizontal: boolean

By default the arrow is vertical, pointing up. This sets the arrow horizontal, pointing right.

offsetX: string | number

A horizontal offset the arrow is moved in px.

Can be set as number or as an JSON object of numbers. The object can contain the keys 'default', 'xl', 'lg', 'md', 'sm', 'xs'. A hylo-breakpoint-listener has to be present. e.g. {"default": "-10", "xs": "-5", "sm": "-5"}

Can also be set as --hylo-glyph-offset-x.

offsetY: string | number

A vertical offset the arrow is moved in px.

Can be set as number or as an JSON object of numbers. The object can contain the keys 'default', 'xl', 'lg', 'md', 'sm', 'xs'. A hylo-breakpoint-listener has to be present. e.g. {"default": "-10", "xs": "-5", "sm": "-5"}

Can also be set as --hylo-glyph-offset-y.

rounded: boolean

Sets rounded lines.

size: string

The stroke thickness or an JSON object of thickness. The object can contain the keys 'default', 'xl', 'lg', 'md', 'sm', 'xs'. e.g. {"default": "5px", "xs": "3px", "sm": "3px"}

Can also be set through --hylo-glyph-arrow-size.

width: string

The width as css style or as an JSON object of css styles. The object can contain the keys 'default', 'xl', 'lg', 'md', 'sm', 'xs'. A hylo-breakpoint-listener has to be present. e.g. {"default": "20px", "xs": "15px", "sm": "15px"}

Can also be set as --hylo-glyph-width.

Generated using TypeDoc