How to display axis labels between the ticks in Charts

This article describes how to display axis labels between the ticks.

Essential EJ2 Chart allows you to position the Category axis  labels between the ticks. You can use labelPlacement  property of the primaryXAxis to customize the tick position. This property takes either OnTicks or BetweenTicks as values. By default, labels in category axis are placed by BetweenTicks.

The following steps explains how to display axis labels between the ticks

Step 1: Create the chart component with category axis.

let chart: Chart = new Chart({
    primaryXAxis: {
      valueType: "Category",
    },
  
    series: [
      {
        dataSource: categoryData,
        xName: "country",
        yName: "gold",
        type: "Column"
      }
    ]
  });
  chart.appendTo("#container");
  
 

Step 2: Use the labelPlacement property to display axis labels between the ticks.

let chart: Chart = new Chart({
    primaryXAxis: {
      valueType: "Category",
      // label placement as between ticks
      labelPlacement: "BetweenTicks"
    }
  });
  chart.appendTo("#container");
  
 

Output

You can see the demo sample from this  link