постройка графика из базы данных.
 

Добрый день, нужно построить график из базы данных.
Есть 2 параметра:
1) дата
2) количество
нужно построить график
Как реализовать? какая библиотека нужна? и как её настроить?
p.s. графиков будет несколько.
p.s.s. и ещё, можно как-то, что бы брались те данные которые сервер передал по началу, при загрузке страницы.

нашёл библиотеку moris с Raphaël, но не работает
help

<script>
new Morris.Line({
  // ID of the element in which to draw the chart.
  element: 'myfirstchart',
  // Chart data records -- each entry in this array corresponds to a point on
  // the chart.
  data: [
    { year: '2008', value: 20 },
    { year: '2009', value: 10 },
    { year: '2010', value: 5 },
    { year: '2011', value: 5 },
    { year: '2012', value: 20 }
  ],
  // The name of the data record attribute that contains x-values.
  xkey: 'year',
  // A list of names of data record attributes that contain y-values.
  ykeys: ['value'],
  // Labels for the ykeys -- will be displayed when you hover over the
  // chart.
  labels: ['Value']
});
</script>
<div id="myfirstchart" style="height: 250px;"></div>

хром кричит
Uncaught TypeError: Cannot read property 'x' of undefined
на Raphaël

ладно, продвинулся дальше, начал строить графики через гугловский скрипт, всё красиво, но!
он не принимает такой тип данных('03.06.2014') для оси x(

google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['data', 'Sales', 'Expenses'],
		  ['06.02.14','2','7'],	['07.02.14','2','3']
        ]);

        var options = {
          title: 'Company Performance',
          hAxis: {title: 'Дата',  titleTextStyle: {color: '#333'}},
          vAxis: {minValue: 0}
        };

        var chart = new google.visualization.AreaChart(document.getElementById('stats'));
        chart.draw(data, options);
      }

Всё порешал, осталось только найти как менять цвета графика

google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['data', 'Только с разным Ip', 'Все'],
		  ['03.06.14',1,2],	['',0,0]
        ]);

        var options = {
          title: 'Статистика',
          hAxis: {title: 'Дата',  
		  titleTextStyle: {color: '#333'}},
          vAxis: {minValue: 0},
		  'legend':'top',
		  hAxis: {baselineColor : '#333'}
        };

        var chart = new google.visualization.AreaChart(document.getElementById('stats'));
        chart.draw(data, options);
      }