Menu
hi,
i am basically trying to get flot to work.
i have dbase full of coordinates(x,y) which i can pull.
Now i need to plot them in a graph.
I looked around, and played with flot for jquery.
pretty cool..
I can change the dataset manually and can see the change.
Now, i want to pull the dataset from dbase.
Looking around others examples and stuffs for more a day now.
And i am getting no where.
map.php:
<html>
<head>
<link href=”assets/style.css” rel=”stylesheet” type=”text/css” />
<script type=”text/javascript” src=”assets/jquery.js”></script>
<script type=”text/javascript” src=”assets/jquery-ui-1.7.2.custom.min.js”></script>
<script type=”text/javascript” src=”assets/tooltip.js”></script>
<script type=”text/javascript” src=”assets/global.js”></script>
<script language=”javascript” type=”text/javascript” src=”flot/jquery.flot.js”></script>
</head>
<body>
<script id=”source” language=”javascript” type=”text/javascript”>
$(document).ready(function() {
get_data();
});
function get_data() {
var options = {
lines: {show: true},
points: {show: true},
legend: {show: true, backgroundColor: “#fff”, noColumns: 4, position: “nw”},
yaxis: { min: 0 },
xaxis: { tickDecimals: 0 },
grid: {color:”#CCCCCC”, backgroundColor: “#fffaff”}
};
$.ajax({ type: ‘POST’,
url: “mapResult.php”,
data: “find=person”,
dataType: “json”,
success: function(result)
{
plot = $.plot($(“#placeholder”), result, options);
}
});
}
</script>
<!– [url]http://www.LiveZilla.net
<script language=”JavaScript” type=”text/javascript”>var script = document.createElement(“script”);script.type=”text/javascript”;var src = “../livezilla/server.php?request=track&output=jcrpt&code=U0VSVkVSUEFHRQ__&nse=”+Math.random();setTimeout(“script.src=src;document.getElementById(‘livezilla_tracking’).appendChild(script)”,1);</script>
<noscript><img src=”../livezilla/server.php?request=track&output=nojcrpt&code=U0VSVkVSUEFHRQ
<!– [url]http://www.LiveZilla.net
<div id=”content”>
<div class=”wrap”>
<?php
//include(‘connect.php’);
echo ‘<table class=box’;
echo ‘<tr >’;
echo ‘<td>’;
echo ‘Lordname:’;
echo ‘</td>’;
echo ‘<td>’;
echo “<input type=text id=lordname value=lordname onfocus=this.value=” onkeyup=’searchMAP()’ onChange=’searchMAP()’>”;
echo ‘</td>’;
echo ‘</tr>’;
echo ‘</table class=box>’;
echo ‘<table>’;
echo ‘<tr><td>Result: </td></tr>’;
echo ‘</table>’;
echo “<div id=’mapresult’ onselectstart=’return false’>”;
echo ‘ </div>’;
?>
</div>
</div>
<div id=”placeholder” style=”width:500px;height:400px;”></div>
<p id=”hoverdata”>Mouse hovers at
(<span id=”x”>0</span>, <span id=”y”>0</span>). <span id=”clickdata”></span></p>
<p><input id=”enableTooltip” type=”checkbox”>Enable tooltip</p>
</body>
</html>
mapResult.php:
<html>
<head>
</head>
<title>mapResult.php</title>
<body>
<?php
include(‘connect.php’);
if(isset($_GET[‘find’]))
{
$find = $
$sqlMAP = mysql_query(“select * from map where lord LIKE ‘%$find%’ limit 0,10”);
$data = ‘[ { label: “$find”, data:[[0,0],[799,-799],’;
$rowCountMAP = mysql_num_rows($sqlMAP);
while($rowMAP = mysql_fetch_array($sqlMAP))
{
echo ‘<table class=box>’;
echo ‘<tr>’;
echo ‘<td>’;
echo $rowMAP[‘lord’].”: “;
echo “(“.$rowMAP[‘x’].”,”.$rowMAP[‘y’].”) : “.$rowMAP[‘CityNameAndCoord’].” “.$rowMAP[‘alliance’].” “;
echo “(“.$rowMAP[‘state’].”) “;
echo “<br />”;
echo ‘</td>’;
echo ‘</tr>’;
echo ‘</table>’;
$data = $data.”[“.$rowMAP[‘x’].”,”.$rowMAP[‘y’].”],”;
}
$data = $data.’]}]’;
echo “<input type=text id=data value=’$data’ >”;
json_encode($data);
}
?>
</div>
</body>
</html>
Basically, where am i wrong ? can anyone help me with the code and visualization ?
Thank you