Графики от MySQL до jQuery FLOT
5 ответов
Дайте угадаю: вы выполняете рендеринг в скрытой вкладке. Я еще не нашел исправления для него, но похоже, что скрытый div (например, display: none) ломает flot, потому что он не может определить размеры div-заполнителя. Рендеринг на вкладке, которая отображается по умолчанию, работает.
Я работаю над той же проблемой. Я хочу, чтобы мой график был на второй вкладке, а первая вкладка содержала некоторые другие данные. Вот мое решение:
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
$("#tabs").bind('tabsshow', function(event, ui) {
if (ui.index == 1) { // second tab
show_graph();
}
});
});
И затем фактический вызов .plot () помещается внутри функции show_graph ().
Just Checking... You did include the placeholder div, right?
<div id="placeholder" style="width:600px;height:300px;"></div>
Вам нужно больше читать документацию Flot, данные серии, которые ожидает Flot, имеют определенный формат. По крайней мере, у вас должно быть
[{label: 'Item 1', data: [1,2]},{label: 'Item 2', data: [2,4]}]
Вот api: Flot API , первый элемент говорит о формате данных, просто измените вывод в соответствии с этими стандартами, и все будет в порядке.
Да, я имел дело с документацией:
«Серии могут быть либо необработанными данными, либо объектом со свойствами. сырой формат данных - массив точек:
[[x1, y1], [x2, y2], ...] "
И в этом примере:
<script id="source" language="javascript" type="text/javascript">
$(function () {
var d1 = [];
for (var i = 0; i < 14; i += 0.5)
d1.push([i, Math.sin(i)]);
var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];
var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];
$.plot($("#placeholder"), [ d1, d2, d3 ]);
});
</script>
Нет необходимости использовать метку:« Метка используется для легенды, если если вы не укажете один, серия не будет отображаться в легенде ».
В любом случае, данные в кодировке JSON включают в себя имена полей инструкции MYSQL, поэтому они должны быть похожи на метку ...
[{"@cnt := @cnt + 1":"0","MAG":"6.87"},{"@cnt := @cnt + 1":"1","MAG":"11.44"}]
изменить имя вашего placeholder div на что-то кроме 'placeholder'?