title: How to change date format in google material design line chart?
body: <p>I am trying to create a line chart using google material design. The chart is displaying correctly however, I want to change the format of the date shown on the chart. </p>
  
  <p>I want only <strong>"Month, Year"</strong> (e.g. Jun, 1994) format instead of the current format which is "Month/Day/Year Hours:Seconds" How do I do that? </p>
  
  <p>Also, I would like to increase the width of the line. The "linewidth" option is also not working.</p>
  
  <p><strong>How do I increase width of the line chart? Also, How do I control the number of labels on the x-axis?</strong></p>
  
  <p>The code for the chart is as shown below.</p>
  
  <p><a href="https://i.stack.imgur.com/jgUex.png" rel="noreferrer"><img src="https://i.stack.imgur.com/jgUex.png" alt="enter image description here"></a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>google.charts.load('current', {
    'packages': ['line']
  });
  
  google.charts.setOnLoadCallback(drawChart);
  
  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('date', 'Year');
    data.addColumn('number', 'DataSize');
    data.addRows(22);
    data.setValue(0, 0, new Date('1994-01-01'));
    data.setValue(0, 1, 25506);
    data.setValue(1, 0, new Date('1994-02-01'));
    data.setValue(1, 1, 26819);
    data.setValue(2, 0, new Date('1994-03-01'));
    data.setValue(2, 1, 31685);
    data.setValue(3, 0, new Date('1994-04-01'));
    data.setValue(3, 1, 25611);
    data.setValue(4, 0, new Date('1994-05-01'));
    data.setValue(4, 1, 29976);
    data.setValue(5, 0, new Date('1994-06-01'));
    data.setValue(5, 1, 32590);
    data.setValue(6, 0, new Date('1994-07-01'));
    data.setValue(6, 1, 33309);
    data.setValue(7, 0, new Date('1994-08-01'));
    data.setValue(7, 1, 35825);
    data.setValue(8, 0, new Date('1994-09-01'));
    data.setValue(8, 1, 41973);
    data.setValue(9, 0, new Date('1994-10-01'));
    data.setValue(9, 1, 54067);
    data.setValue(10, 0, new Date('1994-11-01'));
    data.setValue(10, 1, 45895);
    var formatter_medium = new google.visualization.DateFormat({
      formatType: 'medium'
    });
    formatter_medium.format(data, 1);
    var chart = new google.charts.Line(document.getElementById('dvRise'));
    chart.draw(data, {
      lineWidth: '3',
      left: 0,
      top: 0,
      'height': '300',
      'width': '450',
      colors: ['#44AFED'],
      legend: {
        position: 'none'
      },
      hAxis: {}
    });
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://www.gstatic.com/charts/loader.js"&gt;&lt;/script&gt;
  &lt;div style="text-align: center; height: 320px" id="dvRise"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>