YAxisComponent

A collection of one or more Y-axis configuration components.

Copy Codeimport { Component } from '@angular/core';

@Component({
 selector: 'my-app',
 template: `
   <kendo-chart>
    <kendo-chart-y-axis>
      <kendo-chart-y-axis-item
        [background]="'rgba(100, 100, 100, 0.2)'"
        color="red"
        [notes]="notesConfig"
        [crosshair]="crosshairConfig">
      </kendo-chart-y-axis-item>
      <kendo-chart-y-axis-item name="secondAxis">
      </kendo-chart-y-axis-item>
    </kendo-chart-y-axis>
    <kendo-chart-series>
      <kendo-chart-series-item type="scatter" [data]="[[1, 2]]">
      </kendo-chart-series-item>
      <kendo-chart-series-item type="scatter" [data]="[[0.1, 0.2]]"
                               yAxis="secondAxis">
      </kendo-chart-series-item>
    </kendo-chart-series>
  </kendo-chart>
`
})
export class AppComponent {
public notesConfig = {
  data: [{
      value: 0.2,
      text: "foo"
    }, {
      value: 0.8,
      text: "bar"
    }],
   label: {
    content: (args: any) => args.dataItem.text,
    background: 'red',
    color: 'white'
  },
  line: {
    color: 'blue',
    dashType: 'dash',
    length: 150,
    width: 2
  },
  position: 'top'
};

public crosshairConfig = {
  color: 'green',
  opacity: 0.8,
  visible: true,
  width: 3
};
}

Selector

kendo-chart-y-axis