amcharts 5 remove grid lines and label only keep range label and grid lines

Viewed 10

I do not require to show the grid line. but I need to show range grid line only. if so how to hide default label and grid?

here is my code: but not working:

const yAxis = chart.yAxes.push(
      am5xy.ValueAxis.new(root, {
        min: 0,
        max: 100,
        renderer: am5xy.AxisRendererY.new(root, {
          cellStartLocation: 0,
          strokeOpacity: 0,
          strokeWidth: 0,
        }),
      })
    );

    const yAxisRenderer = yAxis.get('renderer');
    yAxisRenderer.grid.template.setAll({ disabled: true, visible: false });//hides all
    yAxisRenderer.labels.template.setAll({ disabled: true, visible: false }); //hides all

But i want to show the rangeGrid lines and labels. how to handle this?

here is my range function:

function createGrid(value: any) {
      const rangeDataItem = yAxis.makeDataItem({ value: value, affectsMinMax: true });
      rangeDataItem.get('grid')?.setAll({
        stroke: am5.color(0x3a9f4),
        strokeOpacity: 1,
        strokeWidth: 2,
        forceHidden: false,
      });
      const range = yAxis.createAxisRange(rangeDataItem);
      range.get('label')?.setAll({
        fill: am5.color(0x0000ff),
        text: value + '-' + 'x',
        location: 1,
      });
//but not visible
      range.get('grid')?.setAll({
        stroke: am5.color('#FF0000'),
        strokeOpacity: 1,
        location: 1,
      });

      console.log('value', value);
    }

any one share a dmeo for my need? Thanks in advance

0 Answers
Related