How to use the @amcharts/amcharts4/charts.XYCursor function in @amcharts/amcharts4

dateAxis.renderer.grid.template.location = 0;

let valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis.tooltip.disabled = true;
valueAxis.renderer.minWidth = 35;

let series = chart.series.push(new am4charts.LineSeries());
series.dataFields.dateX = "date";
series.dataFields.valueY = "value";
series.strokeWidth = 2;
series.tooltipText = "{valueY} {valueY.change}";

// set stroke property field
series.propertyFields.stroke = "color";

chart.cursor = new am4charts.XYCursor();

let scrollbarX = new am4core.Scrollbar();
chart.scrollbarX = scrollbarX;

series.dataFields.openValueY = "open";
series.dataFields.lowValueY = "low";
series.dataFields.highValueY = "high";
series.tooltipText = "Open:${openValueY.value}\nLow:${lowValueY.value}\nHigh:${highValueY.value}\nClose:${valueY.value}";

// important!
// ohlc series colors are set in states. 
// series.riseFromOpenState.properties.fill = am4core.color("#00ff00");
// series.dropFromOpenState.properties.fill = am4core.color("#FF0000");
// series.riseFromOpenState.properties.stroke = am4core.color("#00ff00");
// series.dropFromOpenState.properties.stroke = am4core.color("#FF0000");

series.riseFromPreviousState.properties.fillOpacity = 1;
series.dropFromPreviousState.properties.fillOpacity = 0;

chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "panX";

// a separate series for scrollbar
let lineSeries = chart.series.push(new am4charts.LineSeries());
lineSeries.dataFields.dateX = "date";
lineSeries.dataFields.valueY = "close";
// need to set on default state, as initially series is "show"
lineSeries.defaultState.properties.visible = false;

// hide from legend too (in case there is one)
lineSeries.hiddenInLegend = true;
lineSeries.fillOpacity = 0.5;
lineSeries.strokeOpacity = 0.5;

let scrollbarX = new am4charts.XYChartScrollbar();
scrollbarX.series.push(lineSeries);

lineSeries.stroke = chart.colors.getIndex(11);
lineSeries.fill = lineSeries.stroke;
lineSeries.strokeWidth = 2;

// second way - add axis range.
let lineSeriesRange = categoryAxis.createSeriesRange(lineSeries);
lineSeriesRange.category = "2018";
lineSeriesRange.endCategory = "2019";
lineSeriesRange.contents.strokeDasharray = "3,3";
lineSeriesRange.locations.category = 0.5;

let bullet = lineSeries.bullets.push(new am4charts.CircleBullet());
bullet.fill = lineSeries.stroke;
bullet.circle.radius = 4;

chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "none";
chart.cursor.lineX.opacity = 0;
chart.cursor.lineY.opacity = 0;

let stepSeries = chart.series.push(new am4charts.StepLineSeries());
stepSeries.dataFields.categoryX = "category";
stepSeries.dataFields.valueY = "stepValue";
stepSeries.noRisers = true;
stepSeries.stroke = am4core.color("#ffffff");
stepSeries.strokeDasharray = "3,3";
stepSeries.interpolationDuration = 3000;
stepSeries.sequencedInterpolation = true;

// because column width is 80%, we modify start/end locations so that step would start with column and end with next column
stepSeries.startLocation = 0.1;
stepSeries.endLocation = 1.1;

chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "none";

series.dataFields.openValueY = "open";
series.dataFields.lowValueY = "low";
series.dataFields.highValueY = "high";
series.tooltipText = "Open:${openValueY.value}\nLow:${lowValueY.value}\nHigh:${highValueY.value}\nClose:${valueY.value}";

// important!
// candlestick series colors are set in states. 
// series.riseFromOpenState.properties.fill = am4core.color("#00ff00");
// series.dropFromOpenState.properties.fill = am4core.color("#FF0000");
// series.riseFromOpenState.properties.stroke = am4core.color("#00ff00");
// series.dropFromOpenState.properties.stroke = am4core.color("#FF0000");

series.riseFromPreviousState.properties.fillOpacity = 1;
series.dropFromPreviousState.properties.fillOpacity = 0;

chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "panX";

// a separate series for scrollbar
let lineSeries = chart.series.push(new am4charts.LineSeries());
lineSeries.dataFields.dateX = "date";
lineSeries.dataFields.valueY = "close";
// need to set on default state, as initially series is "show"
lineSeries.defaultState.properties.visible = false;

// hide from legend too (in case there is one)
lineSeries.hiddenInLegend = true;
lineSeries.fillOpacity = 0.5;
lineSeries.strokeOpacity = 0.5;

let scrollbarX = new am4charts.XYChartScrollbar();
scrollbarX.series.push(lineSeries);

series2.name = "Series 2";
series2.dataFields.valueY = "value2";
series2.fill = chart.colors.next();
series2.stroke = series2.fill;
series2.cursorHoverEnabled = false;

let series3 = chart.series.push(series1.clone());
series3.name = "Series 3";
series3.dataFields.valueY = "value3";
series3.fill = chart.colors.next();
series3.stroke = series3.fill;
series3.cursorHoverEnabled = false;

chart.scrollbarX = new am4core.Scrollbar();

chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "panX";

const dateAxis = chart.xAxes.push(new am4charts.DateAxis() as any);
      dateAxis.renderer.grid.template.location = 0;

      const valueAxis = chart.yAxes.push(new am4charts.ValueAxis() as any);
      if (valueAxis.tooltip) {
        valueAxis.tooltip.disabled = true;
      }
      valueAxis.renderer.minWidth = 35;

      const series = chart.series.push(new am4charts.LineSeries() as any);
      series.dataFields.dateX = 'date';
      series.dataFields.valueY = 'value';

      series.tooltipText = '{valueY.value}';
      chart.cursor = new am4charts.XYCursor() as any;

      const scrollbarX = new am4charts.XYChartScrollbar();
      scrollbarX.series.push(series);
      chart.scrollbarX = scrollbarX as any;
    }

    /**
     * MAP
     */
    if (tsChartMapTypeCheck(chart)) {
      const polygonSeries = new am4maps.MapPolygonSeries();
      polygonSeries.useGeodata = true;
      polygonSeries.include = [
        'PT',
        'ES',
        'FR',

let valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis.tooltip.disabled = true;
valueAxis.renderer.minWidth = 35;

let series = chart.series.push(new am4charts.StepLineSeries());
series.dataFields.dateX = "date";
series.dataFields.valueY = "value";
series.noRisers = true;
series.strokeWidth = 2;
series.fillOpacity = 0.2;
series.stroke = chart.colors.getIndex(14);
series.fill = series.stroke;
series.sequencedInterpolation = true;

series.tooltipText = "{valueY.value}";
chart.cursor = new am4charts.XYCursor();

chart.scrollbarX = new am4core.Scrollbar();

series.tooltipText = "open: {openValueX.value} close: {valueX.value}";
series.sequencedInterpolation = true;
series.fillOpacity = 0;
series.strokeOpacity = 1;
series.columns.template.height = 0.01;
series.tooltip.pointerOrientation = "vertical";

var openBullet = series.bullets.create(am4charts.CircleBullet);
openBullet.locationX = 1;

var closeBullet = series.bullets.create(am4charts.CircleBullet);

closeBullet.fill = chart.colors.getIndex(4);
closeBullet.stroke = closeBullet.fill;

chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "zoomY";

chart.scrollbarX = new am4core.Scrollbar();
chart.scrollbarY = new am4core.Scrollbar();

let dateAxis = chart.xAxes.push(new am4charts.DateAxis());
dateAxis.renderer.grid.template.location = 0;

let valueAxis = chart.yAxes.push(new am4charts.DurationAxis());
valueAxis.tooltip.disabled = true;
valueAxis.renderer.minWidth = 35;
valueAxis.baseUnit = "second";

let series = chart.series.push(new am4charts.StepLineSeries());
series.dataFields.dateX = "date";
series.dataFields.valueY = "seconds";
series.tooltipText = "{valueY.formatDuration()}";
series.fillOpacity = 0.3;

chart.cursor = new am4charts.XYCursor();

let scrollbarX = new am4charts.XYChartScrollbar();
scrollbarX.series.push(series);
chart.scrollbarX = scrollbarX;