title: Amcharts - How to remove gridlines but keep the base x and y axis
body: <p>How can I remove only the gridlines and keep the x-axis and y-axis base line in Amcharts4. I'm using Amcharts with Vuejs. Here the code of the chart component</p>
  <pre><code>&lt;template&gt;
      &lt;b-card&gt;
          &lt;div class=&quot;d-flex align-items-center justify-content-between&quot;&gt;
              &lt;h5&gt;Real Time&lt;/h5&gt;
          &lt;/div&gt;
          &lt;div class=&quot;real-time-graph mt-4&quot; ref=&quot;chartdiv&quot;&gt;&lt;/div&gt;
      &lt;/b-card&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      import * as am4core from &quot;@amcharts/amcharts4/core&quot;;
      import * as am4charts from &quot;@amcharts/amcharts4/charts&quot;;
      import am4themes_animated from &quot;@amcharts/amcharts4/themes/animated&quot;;
  
      am4core.useTheme(am4themes_animated);
  
      export default {
          name: &quot;main-details&quot;,
          mounted() {
             let chart = am4core.create(this.$refs.chartdiv, am4charts.XYChart);
  
              chart.data = [{
                  &quot;date&quot;: &quot;2020-01-01&quot;,
                  &quot;value1&quot;: 180,
                  }, {
                  &quot;date&quot;: &quot;2020-01-08&quot;,
                  &quot;value1&quot;: 300,
                  }, {
                  &quot;date&quot;: &quot;2020-01-15&quot;,
                  &quot;value1&quot;: 160,
                  }, {
                  &quot;date&quot;: &quot;2020-01-22&quot;,
                  &quot;value1&quot;: 650,
                  }, {
                  &quot;date&quot;: &quot;2020-01-29&quot;,
                  &quot;value1&quot;: 220,
                  }, {
                  &quot;date&quot;: &quot;2020-02-05&quot;,
                  &quot;value1&quot;: 440,
                  }, {
                  &quot;date&quot;: &quot;2020-02-12&quot;,
                  &quot;value1&quot;: 550,
                  }, {
                  &quot;date&quot;: &quot;2020-02-19&quot;,
                  &quot;value1&quot;: 290,
                  }, {
                  &quot;date&quot;: &quot;2020-02-26&quot;,
                  &quot;value1&quot;: 440,
                  }, {
                  &quot;date&quot;: &quot;2020-03-04&quot;,
                  &quot;value1&quot;: 150,
                  }, {
                  &quot;date&quot;: &quot;2020-03-11&quot;,
                  &quot;value1&quot;: 430,
                  }];
  
              // Set input format for the dates
              chart.dateFormatter.inputDateFormat = &quot;yyyy-MM-dd&quot;;
              chart.numberFormatter.numberFormat = '#,###w';
  
              // Create axes
              var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
              dateAxis.renderer.minGridDistance = 50;
              dateAxis.renderer.grid.template.disabled = true; 
              dateAxis.renderer.line.disabled = false;
              dateAxis.renderer.ticks.template.disabled = true;
              dateAxis.renderer.labels.template.fill = am4core.color(&quot;#C3CDDD&quot;);
            
              var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
              valueAxis.renderer.grid.template.disabled = true; 
              valueAxis.renderer.labels.template.fill = am4core.color(&quot;#C3CDDD&quot;);
  
              // Create series
              var series1 = chart.series.push(new am4charts.StepLineSeries());
              series1.dataFields.valueY = &quot;value1&quot;;
              series1.dataFields.dateX = &quot;date&quot;;
              series1.strokeWidth = 2;
              series1.stroke = &quot;#3AB7FD&quot;;
  
              series1.fillOpacity = 1;
              var gradient1 = new am4core.LinearGradient();
              gradient1.addColor(chart.colors.getIndex(0), 0.2);
              gradient1.addColor(chart.colors.getIndex(0), 0);
              gradient1.rotation = 90;
              series1.fill = gradient1;
          
          }
      }
  &lt;/script&gt;
  </code></pre>
  <p>Both axis and gridlines are removed using when :</p>
  <pre><code>dateAxis.renderer.ticks.template.disabled = true;
  valueAxis.renderer.grid.template.disabled = true; 
  </code></pre>
  <p><a href="https://i.stack.imgur.com/jWIpc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jWIpc.png" alt="" /></a></p>
  <p>This is the output graph of the above code. I need to show both x and y base axis and only the gridlines removed.</p>