Cannot read property 'valueOf' of null google gannt chart

Question

hello i have been trying to use google gannt charts and it is im rendering this message instead of the chart :

Cannot read property 'valueOf' of null×

Here is some of my code:

This is the script that is building the chart {% for project in projects %} google.charts.load('current', {'packages':['gantt']}); google.charts.setOnLoadCallback(drawChart);

    function drawChart() {
    arr = []
    data_arr = []
    var pk = "{{project.sales_project_id}}"
    var endpoint2 = '/api/gantt/data/'
    $.ajax({
      type: "GET",
      url: endpoint2,
      success: function(data){
        for (i = 0; i < data.timeline.length; i++) {
          if (data.timeline[i][2] == pk) {
                data.timeline[i][0].toString()
                data.timeline[i][1].toString()
                data.timeline[i][2].toString()
                arr.push(data.timeline[i])
              }
        }
        },

            });
      console.log(arr)

      var data = new google.visualization.DataTable();
      data.addColumn('string', 'Task ID');
      data.addColumn('string', 'Task Name');
      data.addColumn('string', 'POC');
      data.addColumn('date', 'Start Date');
      data.addColumn('date', 'End Date');
      data.addColumn('number', 'Duration');
      data.addColumn('number', 'Percent Complete');
      data.addColumn('string', 'Dependencies');

      data.addRows(data_arr);



      var options = {
        height: 400,
        gantt: {
          trackHeight: 30
        }
      };

      var chart = new google.visualization.Gantt(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
  </script>
  {%endfor%}
</head>
{% endblock content %}

This is the data of my api end point:

    {
    "timeline": [
        [
            1,
            1,
            2,
            "2020-02-08",
            "2020-02-01",
            null,
            20,
            null
        ],
        [
            2,
            2,
            2,
            "2020-02-08",
            "2020-05-08",
            null,
            80,
            null
        ],
        [
            3,
            3,
            2,
            "2020-02-08",
            "2020-09-08",
            null,
            80,
            null
        ]
    ]
}

according to google

this is the way they format the data:

  data.addRows([
    ['2014Spring', 'Spring 2014', 'spring',
     new Date(2014, 2, 22), new Date(2014, 5, 20), null, 100, null],
    ['2014Summer', 'Summer 2014', 'summer',
     new Date(2014, 5, 21), new Date(2014, 8, 20), null, 100, null]
  ]);

and here is my data format as seen from my console :

    []
0: (8) [1, 1, 2, "2020-02-08", "2020-02-01", null, 20, null]
1: (8) [2, 2, 2, "2020-02-08", "2020-05-08", null, 80, null]
2: (8) [3, 3, 2, "2020-02-08", "2020-09-08", null, 80, null]
length: 3
__proto__: Array(0)

I am clueless as to what is the error , could someone give me some guidance here?