title: Google chart: “Uncaught (in promise) Error: Unknown header type: 4.7278” error
body: <p>I'm trying to display a line chart of currency rates via <a href="https://developers.google.com/chart/interactive/docs/gallery/linechart" rel="nofollow noreferrer">google charts</a>. </p>
  
  <p>Basically i have 2 type of values:</p>
  
  <ol>
  <li>Date (format iso8601)</li>
  <li>Rate (decimal number)</li>
  </ol>
  
  <p>when i'm trying to render the chart i get an error: "Uncaught (in promise) Error: Unknown header type: 4.7278”</p>
  
  <p>Here is my code:</p>
  
  <p>PHP array making:</p>
  
  <pre><code>        $xml=simplexml_load_file('https://www.ecb.europa.eu/stats/policy_and_exchange_rates/euro_reference_exchange_rates/html/usd.xml') or die("Error: Cannot create object");
      $arrayForChart[] = ["Date","Rate"];
      foreach ($xml-&gt;DataSet-&gt;Series-&gt;Obs as $key =&gt; $value) {
          $dateIso8601Format=(string)$value['TIME_PERIOD'];
          $rateForDate=(string)$value['OBS_VALUE'][0];
          $rateForDate=(float)$rateForDate;
          $arrayForChart[] = [$dateIso8601Format,$rateForDate];
      }
      $arrayForChart = json_encode($arrayForChart);
  </code></pre>
  
  <p>Javascript</p>
  
  <pre><code>var arrayForChart;
  $.ajax({
      type: "POST",
      url: ajaxUrl,
      //data: {configuration: Config },
      success: function (data) {
  
          arrayForChart = data;
          arrayForChart = $.map(arrayForChart, function (el) {
              return el;
          });//converting js object to js array
  
      },
      cache: false
  });
  google.charts.load("current", {packages: ["corechart", "line"]});
  google.charts.setOnLoadCallback(drawLineColors);
  
  function drawLineColors() {
  
      var data = google.visualization.arrayToDataTable([arrayForChart]);
  
      var options = {
          hAxis: {
              title: "Rate",
              id: "Rate",
              label: "Rate",
              type: "number"
          },
          vAxis: {
              title: "Date",
              id: "Date",
              label: "Date",
              type: "string"
          },
          colors: ["#a52714", "#097138"]
      };
  
      var chart = new google.visualization.LineChart(document.getElementById("chart_div"));
      chart.draw(data, options);
  }
  </code></pre>
  
  <p>Sample of data:</p>
  
  <pre><code>["Date","Rate","2011-01-03",4.7278,"2011-01-04",4.7301,"2011-01-05",4.6814,"2011-01-06",4.6635]
  </code></pre>
  
  <p>Anybody might know what is the problem?</p>
  
  <p>Many thanks!</p>