amChart failed to initialize after modal is show - ajax

Question

$.ajax({
cache: false,
type: "POST",
url: route,
data: data,
success: function(response){
$('#evolutieProdus').show();
function showEvProd(data){
var chart = AmCharts.makeChart("chart_2",{
"type": "serial",
"theme": "dark",
"dataProvider" : data,
"valueAxes": [ {
"gridColor": "#FFFFFF",
"gridAlpha": 0.2,
"dashLength": 0
} ],
"gridAboveGraphs": true,
"startDuration": 1,
"graphs": [ {
"balloonText": "[[date]]: <b>[[bucati]] bucati vandute </b>",
"fillAlphas": 0.8,
"lineAlpha": 0.2,
"type": "column",
"valueField": "bucati"
} ],
"chartCursor": {
"categoryBalloonEnabled": false,
"cursorAlpha": 0,
"zoomable": false
},
"categoryField": "date",
"categoryAxis": {
"gridPosition": "start",
"gridAlpha": 0,
"tickPosition": "start",
"tickLength": 20
},
"export": {
"enabled": true
}
});
}
showEvProd(response);
console.log(response);
},
error: function(){
toastr.error('Eroare, ceva nu a functionat corect, reveniti mai tarziu');
}
});
This is my ajax call. I receive the callback with the data but in the graph all I see is an undefined. What is wrong with my code .
P.S. If I hard-coding the dataProvider object it works. But I want to load the graph with the data provided by the server via the ajax response.