Диаграмма из базы данных

Я пытаюсь реализовать график из базы данных, но у меня есть несколько проблем …

у меня есть База данных с 2 строками: дата, Pcr

Мои файлы .php:

Data.php

$query = "SELECT * FROM  `table1` ORDER BY Date LIMIT 0 , 100";
$result = mysql_query($query) or die("SQL Error 1: " . mysql_error());

$dates=array();

while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
$dates[] = $row['Date'];
$dates[] = $row['Pcr'];
}
echo json_encode($dates);

Я получаю массив:
[ «2015-06-14», «0,77», «2015-06-20», «0,79», «2015-09-24», «0,88», «2015-10-26», «0.8»,» 2015-10-30″ , «0.7»]

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

У меня есть этот статический файл:

chart.php

    <div class="resultados"><canvas id="grafico"></canvas></div>

<script>
$(document).ready(function(){
$.ajax({
type:'POST',
url:'data.php',

success:function(data){

var valores = eval(data);
var date1 = valores[0];
var pcr1 = valores[1];
var date2 = valores[2];
var pcr2 = valores[3];
var date3 = valores[4];
var pcr3 = valores[5];
var date4 = valores[6];
var pcr4 = valores[7];


var Datos = {
labels : [date1,date2,date3,date4],
datasets : [
{

fillColor : 'rgba(255,0,0,0.1)',
strokeColor :'rgba(255,0,0,100)',
pointColor : 'rgba(255,0,0,100)',
pointStrokeColor:"#e32636",
pointHighlightFill:"#bbf",
pointHighlightStroke:"rgba(255,0,0,255)",

data : [pcr1,pcr2,pcr3,pcr4]
}
]
}

var contexto = document.getElementById('grafico').getContext('2d');
window.Barra = new Chart(contexto).Line(Datos, { responsive : true });
}
});
return false;
}
)
</script>

Может ли кто-нибудь помочь мне найти то, что я должен поместить в данные: []?

большое спасибо