Symfony: редактируйте файл JavaScript с информацией базы данных

Question

В настоящее время я прохожу стажировку в компании, и моя миссия - создать GANTT, связанный с информацией базы данных.

Для GANTT я использовал Google Gantt Chart (JavaScript):

function ganttnew() {
    google.charts.load('current', {'packages': ['gantt']});
 
    google.charts.setOnLoadCallback(drawChart);
 
 
    function drawChart() {
 
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'ID');
        data.addColumn('string', 'Nom action');
        data.addColumn('string', 'Groupe de travail');
        data.addColumn('date', 'Date de début');
        data.addColumn('date', 'Date de fin');
        data.addColumn('number', 'Durée');
        data.addColumn('number', 'Avancement');
        data.addColumn('string', 'Dependencies');
 
        data.addRows([
            ['11', 'Action Gantt 1', 'Apprendre Gimp',
                new Date(2019, 5, 28), new Date(2019, 6, 26), null, 50, null],
            ['12', 'Action Gantt 2', 'Apprendre Gimp',
                new Date(2019, 5, 25), new Date(2019, 6, 26), null, 25, null]
        ]);
 
        var options = {
            height: 400,
            gantt: {
                trackHeight: 30
            }
        };
 
        var chart = new google.visualization.Gantt(document.getElementById('chart_div'));
 
        chart.draw(data, options);
    }
}

Этот файл отлично работает, когда я вызываю его в виде веточки:

<script src="{{ asset('../js/gantt-new.js') }}"></script>
<p id="chart_div" onclick="ganttnew()">GANTT</p>

Вот результат: GANTT

Так что это моя проблема: я хотел бы, чтобы данные в data.addRows были даннымииз моей базы данных и не фиксированных данных.Но я действительно не знаю, как это сделать (создание AJAX, безусловно, возможно, но я никогда не делал).Если кто-то может рассказать мне о моей проблеме, посоветовав мне учебные пособия или предложив мне курс действий, я нахожусь на нем.

Если я не знаю, как получить данные из базы данных, я могу отобразить их вмой вид ветки:

{% for action in actions %}
   {{ action }}
{% endfor %}

А для более подробной информации вот мой контроллер:

class GanttController extends AbstractActionController
{

    public function testAction($id)
    {
        if ($id == "all") {
            $test = "all";
            $actions = $this->getServiceFactory()->getActionService()->getAdminActions();
            return $this->render('@../Gantt/GanttTest.html.twig', array(
                'actions' => $actions,
                'test' => $test
            ));
        } else {
            $test = $this->getManagerFactory()->getTestManager()->getById($id);
            $actions = $this->getManagerFactory()->getActionManager()->getActionsForProject($test);
            return $this->render('@../Gantt/GanttTest.html.twig', [
                'actions' => $actions,
                'test' => $test
            ]);
        }
    }
}

Заранее благодарю за помощь.