Port charts.php to flotr 2
Former-commit-id: 3488b529b0fc478995ca9e06b66c233d44a36ea1
--- a/charts.php
+++ b/charts.php
@@ -2,99 +2,79 @@
include_once('include/common.inc.php');
include_header();
$db = $server->get_db('disclosr-agencies');
-
-
?>
<div class="foundation-header">
<h1><a href="about.php">Charts</a></h1>
<h4 class="subheader">Lorem ipsum.</h4>
</div>
-<div id="placeholder" style="width:900px;height:600px;"></div>
+<div id="placeholder" style="width:900px;height:500px;"></div>
<script id="source">
-window.onload = function() {
- $(document).ready(function() {
- var d1 = [];
- var labels = [];
+ window.onload = function() {
+ $(document).ready(function() {
+ var d1 = [];
+ var labels = [];
<?php
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;
- echo " labels.push('{$row->key}');".PHP_EOL;
- }*/
- $dataValues = Array();
- foreach ($rows as $row) {
- $dataValues[$row->value] = $row->key;
+
+ $dataValues = Array();
+ foreach ($rows as $row) {
+ $dataValues[$row->value] = $row->key;
+ }
+ $i = 0;
+ 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);
- foreach($dataValues as $value => $key) {
-
- 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]);
+ ?>
+ function trackformatter(obj) {
+ if (labels[Math.floor(obj.x)]) {
+ return (labels[Math.floor(obj.x)])+"="+obj.y;
- } else {
- return "";
- }
-
- },
- labelAngle: 90
+ } else {
+ return "";
+ }
}
- });
-
-var previousPoint = null;
-$("#placeholder").bind("plothover", function (event, pos, item) {
- if (item) {
- if (previousPoint != item.datapoint) {
- previousPoint = item.datapoint;
-
- $("#tooltip").remove();
- var x = item.datapoint[0],
- y = item.datapoint[1] - item.datapoint[2];
-
- showTooltip(item.pageX, item.pageY, y );
- }
- }
- else {
- $("#tooltip").remove();
- previousPoint = null;
- }
-});
+ function tickformatter(val, axis) {
+ if (labels[Math.floor(val)]) {
+ return '<p style="margin-top:8em;-webkit-transform:rotate(-90deg);">'+(labels[Math.floor(val)])+"</b>";
+
+ } else {
+ return "";
+ }
+ }
+ Flotr.draw(document.getElementById("placeholder"), [ {data: d1}], {
+ HtmlText: true,
+ bars : {
+ show : true
+ },
+ mouse : {
+ track : true,
+ relative : true,
+ trackFormatter: trackformatter
+ },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>
<?php
--- a/include/template.inc.php
+++ b/include/template.inc.php
@@ -68,10 +68,9 @@
<!-- Included JS Files -->
<script src="<?php echo $basePath; ?>javascripts/foundation.js"></script>
<script src="<?php echo $basePath; ?>javascripts/app.js"></script>
- <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
+ <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
- <!--<script type="text/javascript" src="javascripts/jquery.js"></script>-->
- <script type="text/javascript" src="javascripts/flot/jquery.flot.js"></script>
+ <script type="text/javascript" src="javascripts/flotr2/flotr2.js"></script>
</body>
</html>
--- a/javascripts/flot
+++ /dev/null