图表从MYSQL到jquery FLOT

我发现了用于绘制漂亮图表的jquery的flot。但是我无法解析我想从MYSQL表示的数据。它的驾驶我疯了，因为我得到这个错误：图表从MYSQL到jquery FLOT

uncaught exception: Invalid dimensions for plot, width = 0, height = 0

有什么办法把MYSQL数据转换成从该海军报除了?:

PHP的一部分：

<?php 
include './includes/config.php'; 
include './includes/opendb.php'; 

$ID=$_GET["ID"]; 
$data=$_GET["data"]; 

$query_set = "SET @cnt = -1"; 
$query = "SELECT @cnt +1, {$data} FROM table_inf where ID = {$ID};"; 

$result = mysql_query("{$query_set}"); 
if (!$result) { 
die("Query to show fields from table failed"); 
} 

$result = mysql_query("{$query_select}"); 
if (!$result) { 
die("Query to show fields from table failed"); 
} 

$arr = array(); 
while($obj = mysql_fetch_object($result)) 
{ 
    $arr[] = $obj; 
} 

//NOW OUTPUT THE DATA: 
print json_encode($arr); 

mysql_free_result($result); 
include './includes/closedb.php'; 
?>

JavaScript部分：

<script type="text/javascript"> 

function get_data() { 

var options = { 
lines: {show: true}, 
points: {show: true}, 
yaxis: { min: 0 }, 
}; 

$.ajax({ url: "return_values.php?ID=1&data=MAG", 
dataType: "json", 
success: function(result) 
{ 
plot = $.plot($("#placeholder"), result, options); 
} 
}); 
}; 
</script>

我一直googling ..没有成功。看起来很简单，但情节根本不会理解数据...什么...

php文件的输出（用于两个项目为例）如下：

[{"@cnt := @cnt + 1":"0","MAG":"6.87"},{"@cnt := @cnt + 1":"1","MAG":"11.44"}]

哪里@ cnt是每行（0,1,2,3 ...）x轴递增的计数器，MAG是y轴上显示的数据本身。

我使用的jQuery是：

<script src="./javascripting/jquery-1.3.2.js" type="text/javascript"></script> 
<script src="./javascripting/jquery.tabs.pack.js" type="text/javascript"></script> 
<script language="javascript" type="text/javascript" src="./javascripting/jquery.flot.js"></script>

其中海军报是0.5版本和浏览器Firefox浏览器。

来源

2009-10-20 echedey lorenzo

您可能想要发布一些PHP脚本的输出，以便人们可以看到JSON编码数据的外观。 – 2009-10-20 17:33:56

是的，你是对的，只是编辑它。谢谢 – 2009-10-20 17:54:39

你可能想要添加你正在使用的jQuery插件。可以是flot插件，但不能单独从您的代码中分辨出来。 – googletorp 2009-10-20 17:55:38

让我猜测：你正在隐藏的标签中呈现。我还没有找到它的修复，但它看起来像隐藏div（例如，display：none）因为无法确定占位符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（）函数中。

来源

2010-08-07 15:34:12 edebill

只是检查......你确实包括了占位符div，对吗？

<div id="placeholder" style="width:600px;height:300px;"></div>

来源

2009-10-20 19:47:56 RobertPaulson

是啊我使用的div是：

– 2009-10-20 20:14:13

你需要阅读的海军报文档的详细，是海军报预计该系列数据是在特定的格式。至少，你应该有

[{label: 'Item 1', data: [1,2]},{label: 'Item 2', data: [2,4]}]

这里是API：Flot API，第一项说数据格式，只是改变输出以满足这些标准，你应该罚款。

来源

2009-10-20 20:30:26 ohdeargod

-1

是的，我已被处理的文档：

“A系列可以是原始数据或与属性的对象的原始数据格式是点的数组：

[[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>

没有必要使用的标签：” 标签用于为l egend，如果你没有指定，系列将不会显示在图例中。“

无论如何，JSON编码数据包括MYSQL声明的字段的名称，因此它应该像一个标签...

[{"@cnt := @cnt + 1":"0","MAG":"6.87"},{"@cnt := @cnt + 1":"1","MAG":"11.44"}]

来源

2009-10-21 06:38:44

-3

改变你的占位符div的名字不是“占位符以外的东西“？

来源

2010-03-05 05:57:29 mikebc

我遇到了同样的问题。感谢edebill的解决方案。也许，这是新的，但jQuery UI的标签文档的网站，现在提到了这个问题，必须通过改变CSS位置非常简单的解决方案： http://docs.jquery.com/UI/Tabs

而不是隐藏你只需动面板关闭屏幕：

.ui-tabs .ui-tabs-hide { 
    position: absolute; 
    left: -10000px; 
}

来源

2010-12-13 21:44:08 Voodoo

不错，谢谢！你可能想包括，如果你不是直接编辑jQuery css你应该也添加显示：inline！important;或者它不会工作 – Cory 2011-02-07 20:47:34

图表从MYSQL到jquery FLOT

回答

相关问题