Port charts.php to flotr 2
[disclosr.git] / charts.php
blob:a/charts.php -> blob:b/charts.php
<?php <?php
include_once('include/common.inc.php'); include_once('include/common.inc.php');
include_header(); include_header();
$db = $server->get_db('disclosr-agencies'); $db = $server->get_db('disclosr-agencies');
   
   
?> ?>
<div class="foundation-header"> <div class="foundation-header">
<h1><a href="about.php">Charts</a></h1> <h1><a href="about.php">Charts</a></h1>
<h4 class="subheader">Lorem ipsum.</h4> <h4 class="subheader">Lorem ipsum.</h4>
</div> </div>
<div id="placeholder" style="width:900px;height:600px;"></div> <div id="placeholder" style="width:900px;height:500px;"></div>
<script id="source"> <script id="source">
window.onload = function() { window.onload = function() {
$(document).ready(function() { $(document).ready(function() {
var d1 = []; var d1 = [];
var labels = []; var labels = [];
<?php <?php
try { try {
$rows = $db->get_view("app", "scoreHas?group=true", null, true)->rows; $rows = $db->get_view("app", "scoreHas?group=true", null, true)->rows;
   
/*foreach ($rows as $key => $row) {  
echo " d1.push([$key, {$row->value}]);".PHP_EOL; $dataValues = Array();
echo " labels.push('{$row->key}');".PHP_EOL; foreach ($rows as $row) {
}*/ $dataValues[$row->value] = $row->key;
$dataValues = Array(); }
foreach ($rows as $row) { $i = 0;
$dataValues[$row->value] = $row->key; ksort($dataValues);
  foreach ($dataValues as $value => $key) {
   
  echo " d1.push([$i, $value]);" . PHP_EOL;
  echo " labels.push('$key');" . PHP_EOL;
  $i++;
  }
  } catch (SetteeRestClientException $e) {
  setteErrorHandler($e);
} }
$i = 0; ?>
ksort($dataValues); function trackformatter(obj) {
foreach($dataValues as $value => $key) { if (labels[Math.floor(obj.x)]) {
  return (labels[Math.floor(obj.x)])+"="+obj.y;
echo " d1.push([$i, $value]);".PHP_EOL;  
echo " labels.push('$key');".PHP_EOL;  
$i++;  
}  
} catch (SetteeRestClientException $e) {  
setteErrorHandler($e);  
}  
?>  
   
$.plot($("#placeholder"), [ d1], {  
grid: { hoverable: true },  
   
series: {  
bars: { show: true, barWidth: 0.6 }  
},  
xaxis: {  
tickFormatter: function formatter(val, axis) {  
if (labels[val]) {  
return(labels[val]);  
} else { } else {
return ""; return "";
} }
   
},  
labelAngle: 90  
} }
}); function tickformatter(val, axis) {
  if (labels[Math.floor(val)]) {
var previousPoint = null; return '<p style="margin-top:8em;-webkit-transform:rotate(-90deg);">'+(labels[Math.floor(val)])+"</b>";
$("#placeholder").bind("plothover", function (event, pos, item) {  
if (item) { } else {
if (previousPoint != item.datapoint) { return "";
previousPoint = item.datapoint; }
  }
$("#tooltip").remove(); Flotr.draw(document.getElementById("placeholder"), [ {data: d1}], {
var x = item.datapoint[0], HtmlText: true,
y = item.datapoint[1] - item.datapoint[2]; bars : {
  show : true
showTooltip(item.pageX, item.pageY, y ); },
} mouse : {
} track : true,
else { relative : true,
$("#tooltip").remove(); trackFormatter: trackformatter
previousPoint = null; },yaxis: {
} min:0
}); },
  xaxis: {
   
  minorTickFreq: 0.6,
  noTicks : 19,
  tickFormatter: tickformatter
  }
  });
   
}); });
}; };
function showTooltip(x, y, contents) {  
$('<div id="tooltip">' + contents + '</div>').css( {  
position: 'absolute',  
display: 'none',  
top: y + 5,  
left: x + 5,  
border: '1px solid #fdd',  
padding: '2px',  
'background-color': '#fee',  
opacity: 0.80  
}).appendTo("body").fadeIn(200);  
}  
</script> </script>
   
<?php <?php
include_footer(); include_footer();
?> ?>