флот не рисует диаграмму баров

Question

Я пробовал с двумя моими двумя сценариями (линейная диаграмма и круговая диаграмма), но флот не рисует диаграмму баров ... вы можете мне помочь с этим ... Я думаю, что ошибка находится в JavaScript ..

библиотека:

<script src="js/jquery.flot.min.js"></script> 
<script src="js/jquery.flot.pie.min.js"></script> 
<script src="js/jquery.flot.stack.js"></script> 
<script src="js/jquery.flot.resize.min.js"></script> 

Вот PrintData дб вызов:

[["junio",390],["julio",125],["agosto",50]] 

Вот скрипт в graficayear.php:

<?php 
include 'includes/configs.php'; 
$sql = $conn->prepare("SELECT DATE_FORMAT(start, '%M') AS mdate, SUM(honorario) AS total_mes 
FROM CITAS WHERE YEAR(current_date) GROUP BY mdate DESC"); 
    $sql->execute(); 
    while($row = $sql->fetch(PDO::FETCH_ASSOC)) { 

    $datayear[] = array($row['mdate'],(int) $row['total_mes']); 
} 
?> 

Вот код в chartyear.php:

<?php include 'graficayear.php'; ?> 
<script type='text/javascript' charset='utf-8'> 
$(function() { 
$.plot(
    $("#baryear"), 
    [{ 
     data : <?php echo json_encode($datayear);?>, 
     color: '#012D4C', 
     bars: { show: true, fillColor: '#4682b4', barWidth: (15*24*60*60*1000), align: 'center' } 
    }], 
    { 
     grid: { color: '#012D4C' }, 
     xaxis: { 
      mode: 'time', 
      tickDecimals: 0, 
      tickSize: [1,'month'], 
      autoscaleMargin: 0.001 
     } 
    } 
); 
}); 
</script> 

И DIV с ID:

<?php include 'chartyear.php'; ?> 
<div id="baryear" style="width: 320px; height: 300px;"></div> 

вот как мой график выглядеть до сих пор:

И вот данные, которые мне нужно показать внутри баров c олень:

Answer 1

Вы должны прочитать документацию об ожидаемых форматах данных более тщательно. Здесь вы указали xAxis of type time, но затем имеете given it categories. Вы должны выбирать так или иначе.

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

// given your data 
var datayear = [["junio",390],["julio",125],["agosto",50]]; 

// split it into a data array and a ticks array 
var data = [], ticks = []; 
for (var i = 0; i < datayear.length; i++) { 
    data.push([i,datayear[i][1]]); // note that the x value is numeric 
    ticks.push([i,datayear[i][0]]); // and that the x value is matched to a "category" 
} 

$.plot(
    $("#baryear"), 
     [{ 
      data : data, 
      color: '#012D4C', 
      bars: { show: true, fillColor: '#4682b4', align: 'center' } 
     }], 
    { 
     grid: { color: '#012D4C' }, 
     xaxis: { 
      ticks: ticks 
     } 
    }); 

скрипку here.

Производит: