javascript - Create a multi-series line flot chart getting data from database -

i trying create line flot chart multiple series getting data database.

this table have:

code | date/time  -----------------------     | 9-10-2016 09:25  b    | 10-11-2016 10:11  c    | 11-10-2016 14:23     | 9-10-2016 10:10  b    | 10-11-2016 11:00 

so, need show in chart total number of occurrences each "code". in above table, have 2 occurrences code "a", 2 occurrences of code "b" , 1 occurrence of code "c".

i don't have problems creating flot chat not able proper data variables time series in flot chart.

so, how extract data form database using mysql , php ???

below code of flot chart have 1 line series , need add series available in database, 10 or 100.

i have var d1 , need add d2, d3, d4.....

<script type="text/javascript"> 

$(document).ready(function () {

var d1 = [<?php print_r($js_array1); ?>];  var data = [{label: "<?php echo $error_code; ?>" , data: d1, lines: { show: true, fill: false }, points: { show: true }, color: "#478514" } ];  var p = $.plot($("#placeholder"), data, {         xaxis: {   ticks: 8,   mode: 'time' }, yaxis: {   ticks: 6,   min: 0 }, grid: {   backgroundcolor: { colors: ['#fff', '#eee'] },   hoverable: true }, legend: {   labelformatter: function(label, series) {     return '<a href="$chart_label_link">' + label + '</a>';   }         } });  $.each(p.getdata()[0].data, function(i, el){     var o = p.pointoffset({x: el[0], y: el[1]});     $('<div class="data-point-label">' + el[1] + '</div>').css( {         position: 'absolute',         left: o.left -10,         top: o.top -20,         display: 'none',         'font-size': '13px'     }).appendto(p.getplaceholder()).fadein('slow'); });  function showtooltip(x, y, contents, z) {     $('<div id="flot-tooltip">' + contents + '</div>').css( {         position: 'absolute',         display: 'none',         top: y - 30,         left: x + 30,         border: '2px solid',         padding: '2px',         'background-color': '#fff',         opacity: 0.80,         'font-size': '10px',         'border-color': z,         '-moz-border-radius': '5px',         '-webkit-border-radius': '5px',         '-khtml-border-radius': '5px',         'font-family': 'verdana, arial, helvetica, tahoma, sans-serif',         'border-radius': '5px'     }).appendto("body").fadein(200); }    function getmonthname(numericmonth) {     var montharray = ["jan", "feb", "mar", "apr", "may", "jun", "jul", "aug", "sep", "oct", "nov", "dec"];     var alphamonth = montharray[numericmonth];      return alphamonth; }  function converttodate(timestamp) {     var newdate = new date(timestamp);     var datestring = newdate.getmonth();     var monthname = getmonthname(datestring);      return monthname; }  var previouspoint = null; var previouspointlabel = null;  $("#placeholder").bind("plothover", function (event, pos, item) {     if (item) {         if ((previouspoint != item.dataindex) || (previouslabel != item.series.label)) {             previouspoint = item.dataindex;             previouslabel = item.series.label;              $("#flot-tooltip").remove();              var x = converttodate(item.datapoint[0]);             y = item.datapoint[1];             z = item.series.color;              showtooltip(item.pagex, item.pagey,                     "<b>" + item.series.label + "</b><br />" + y + " transactions impacted.",                     z);         }     } else {         $("#flot-tooltip").remove();         previouspoint = null;     }     }); }); 

i appreciate help... lot!

you need use post or method pull data database, json array need turn object or assign series of variables can created needed hold recieved data.

i suggest looking @ http://www.w3schools.com/tags/ref_httpmethods.asp , http://www.w3schools.com/php/php_mysql_intro.asp basics on interacting mysql database via php. hope helps!