# AxisLeft

> Value labels on the left, right-aligned against the plot.

Source: https://ui.jcsoftdev.com/docs/components/axis-left

Value labels on the left, right-aligned against the plot.

## Import

```ts
import { AxisLeft } from "@jcsoftdev/ui/charts";
```

Single-component entry points tree-shake to just this component: `@jcsoftdev/ui/charts/core`.

## Usage

```tsx
export const Default: Story = {
  render: () => <AxesDemo title="Ventas" rightTitle="Cortes" showRight={false} showGrid />,
};
```

_Source of the Storybook story._

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `ticks` * | `readonly AxisTick[]` |  |  |
| `offset` * | `number` |  | Offset of the axis line: `y` for bottom, `x` for left/right. |
| `title` | `string` |  |  |
| `color` | `string` |  | Overrides the label color (a value axis matched to its series). |
| `rotate` | `number` |  | Tilts the labels by this many degrees (negative reads up and to the right), e.g. -45. |

`*` marks a required prop.

## Storybook stories

- [Default](/storybook/?path=/story/charts-primitives-axes--default)
- [Dual Axis](/storybook/?path=/story/charts-primitives-axes--dual-axis)
- [Without Grid](/storybook/?path=/story/charts-primitives-axes--without-grid)
- [Default](/storybook/?path=/story/charts-primitives-cartesianchart--default)
- [Stacked](/storybook/?path=/story/charts-primitives-cartesianchart--stacked)
- [Horizontal](/storybook/?path=/story/charts-primitives-cartesianchart--horizontal)
- [Columns And Line On Right Axis](/storybook/?path=/story/charts-primitives-cartesianchart--columns-and-line-on-right-axis)
- [Area With Goal](/storybook/?path=/story/charts-primitives-cartesianchart--area-with-goal)
- [With Brush](/storybook/?path=/story/charts-primitives-cartesianchart--with-brush)
- [Loading](/storybook/?path=/story/charts-primitives-cartesianchart--loading)
- [Empty](/storybook/?path=/story/charts-primitives-cartesianchart--empty)
- [Default](/storybook/?path=/story/charts-primitives-categoryslider--default)
- [Default](/storybook/?path=/story/charts-primitives-chartbreadcrumb--default)
- [Root Only](/storybook/?path=/story/charts-primitives-chartbreadcrumb--root-only)
- [Interactive](/storybook/?path=/story/charts-primitives-chartbreadcrumb--interactive)
- [Default](/storybook/?path=/story/charts-primitives-chartbrush--default)
- [Full Range](/storybook/?path=/story/charts-primitives-chartbrush--full-range)
- [Default](/storybook/?path=/story/charts-primitives-chartdatatable--default)
- [Missing Values](/storybook/?path=/story/charts-primitives-chartdatatable--missing-values)
- [Default](/storybook/?path=/story/charts-primitives-chartframe--default)
- [Fills Parent](/storybook/?path=/story/charts-primitives-chartframe--fills-parent)
- [Aspect Ratio](/storybook/?path=/story/charts-primitives-chartframe--aspect-ratio)
- [With Legend And Table](/storybook/?path=/story/charts-primitives-chartframe--with-legend-and-table)
- [Loading](/storybook/?path=/story/charts-primitives-chartframe--loading)
- [Loading Ring](/storybook/?path=/story/charts-primitives-chartframe--loading-ring)
- [Empty](/storybook/?path=/story/charts-primitives-chartframe--empty)
- [Read Only](/storybook/?path=/story/charts-primitives-chartlegend--read-only)
- [Toggleable](/storybook/?path=/story/charts-primitives-chartlegend--toggleable)
- [Centered](/storybook/?path=/story/charts-primitives-chartlegend--centered)
- [Bars](/storybook/?path=/story/charts-primitives-chartskeleton--bars)
- [Line](/storybook/?path=/story/charts-primitives-chartskeleton--line)
- [Ring](/storybook/?path=/story/charts-primitives-chartskeleton--ring)
- [Empty](/storybook/?path=/story/charts-primitives-chartskeleton--empty)
- [Default](/storybook/?path=/story/charts-primitives-charttooltip--default)
- [Flips Near The Right Edge](/storybook/?path=/story/charts-primitives-charttooltip--flips-near-the-right-edge)
- [Without Title](/storybook/?path=/story/charts-primitives-charttooltip--without-title)
- [Default](/storybook/?path=/story/charts-primitives-exportmenu--default)
- [Spanish](/storybook/?path=/story/charts-primitives-exportmenu--spanish)
- [Default](/storybook/?path=/story/charts-primitives-hierarchyheader--default)
- [At Root](/storybook/?path=/story/charts-primitives-hierarchyheader--at-root)
- [Default](/storybook/?path=/story/charts-primitives-hierarchylegend--default)
- [Drilled In](/storybook/?path=/story/charts-primitives-hierarchylegend--drilled-in)
- [Limited](/storybook/?path=/story/charts-primitives-hierarchylegend--limited)
- [Leaf](/storybook/?path=/story/charts-primitives-hierarchylegend--leaf)
- [Default](/storybook/?path=/story/charts-primitives-hierarchytable--default)
- [From Branch](/storybook/?path=/story/charts-primitives-hierarchytable--from-branch)
- [Gallery](/storybook/?path=/story/charts-primitives-chartpatterndefs--gallery)
- [Custom Tile](/storybook/?path=/story/charts-primitives-chartpatterndefs--custom-tile)
- [Default](/storybook/?path=/story/charts-primitives-plotoverlay--default)
- [Vertical Keys](/storybook/?path=/story/charts-primitives-plotoverlay--vertical-keys)
- [Both Axes Keys](/storybook/?path=/story/charts-primitives-plotoverlay--both-axes-keys)
- [Default](/storybook/?path=/story/charts-primitives-unitglyph--default)
- [Fills Up](/storybook/?path=/story/charts-primitives-unitglyph--fills-up)
- [Scissors](/storybook/?path=/story/charts-primitives-unitglyph--scissors)
- [Without Track](/storybook/?path=/story/charts-primitives-unitglyph--without-track)

## Source

`packages/ui/src/charts/core/axes.tsx`