title: Trendlines in google charts
body: <p>I am using google charts library but could not draw a trendline may be because i am using a <code>string</code> as hAxis and <code>number</code> as vAxis, what i found till now is that it's impossible to draw a trendline until both axis are number, but i have seen example where Date as hAxis is used but i assume that's because that is comparable.<br>
  So can i draw a trendLine with xAxis as String?</p>
  
  <p><br>
  My Code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      google.load('visualization', '1.1', {'packages': ['corechart'], 'callback': drawChart});
  
      function drawChart() {
       var data = new google.visualization.DataTable();
        &lt;g:each status="counter" var="row" in="${transactionsColumns}"&gt;
          data.addColumn("${row[0]}","${row[1]}");
          &lt;/g:each&gt;
          var tempData=new Array();
          &lt;g:each status="counter" var="row" in="${transactionsData}"&gt;
          var lowerArray=new Array();
          &lt;g:each status="eIndex" var="element" in="${row}"&gt;
  
          &lt;g:if test="${eIndex==0}"&gt;
          var column="${row[eIndex]}"
          lowerArray[${eIndex}]=column;
          &lt;/g:if&gt;
          &lt;g:else&gt;
          var column=${row[eIndex]}
          lowerArray[${eIndex}]=column;
          &lt;/g:else&gt;
  
          &lt;/g:each&gt;
          tempData[${counter}]=lowerArray;
          &lt;/g:each&gt;
       data.addRows(tempData);
  
  
       var options = {'title':"${transactionsColumns[1][1]}",
               'width':'auto',
               'height':'auto',
  
               trendlines: {
                 0: {
                   visibleInLegend: true,
                   color: 'purple',
                   lineWidth: 10,
                   opacity: 0.2,
                 }
               }
               };
  
       var chart = new google.visualization.LineChart(document.getElementById("lineChart${divId}"));
       chart.draw(data, options);
      }
      &lt;/script&gt;
  </code></pre>
  
  <p><br>
  <strong>EDIT:</strong> After jmac help i was able to do this:<br>
  <img src="https://i.stack.imgur.com/LMuYo.png" alt="Graph with string x-axis but actual a number"></p>
  
  <p>now i got what i wanted on hovering at graph points, but not on x-axis itself it still showing number
  <br><strong>My code:</strong> this is one cell</p>
  
  <pre><code>lowerArray[${eIndex}]= {v:${counter+1},f:column};  //LHS dont care about it. v:loop_var(1,2,3..),f:"MyString"
  </code></pre>