--- a/lib/graphs.inc.php +++ b/lib/graphs.inc.php @@ -6,6 +6,8 @@ <script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.js"></script> <script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.pie.js"></script> + <script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.selection.js"></script> + <script language="javascript" type="text/javascript" src="lib/flot/jquery.flot.stack.js"></script> '; $includedFlot = true; @@ -18,11 +20,13 @@ ?> <center><div id="cndist" style="width:900px;height:550px"></div></center> <script type="text/javascript"> + var placeholder = $("#cndist"); $(function () { var d1 = []; + var d2 = []; <?php -$query = 'select cnid, count(*) from (select ("CNID" - MOD("CNID",100)) as cnid from contractnotice where "CNID" < 999999) as a group by cnid order by cnid'; +$query = 'select cnid, count(*) from (select ("CNID" - MOD("CNID",100)) as cnid from contractnotice where "CNID" < 999999 and "parentCN" is null) as a group by cnid order by cnid'; $query = $conn->prepare($query); $query->execute(); if (!$query) { @@ -34,23 +38,93 @@ echo "d1.push([ ".intval($delta['cnid']).", ".intval($delta['count'])."]); \n"; }; +$query = 'select cnid, count(*) from (select ("CNID" - MOD("CNID",100)) as cnid from contractnotice where "CNID" < 999999 and "parentCN" is not null) as a group by cnid order by cnid'; +$query = $conn->prepare($query); +$query->execute(); +if (!$query) { + databaseError($conn->errorInfo()); + return Array(); +} + +foreach ($query->fetchAll() as $delta) { + + echo "d2.push([ ".intval($delta['cnid']).", ".intval($delta['count'])."]); \n"; +}; ?> - var placeholder = $("#cndist"); - - var plot = $.plot(placeholder, [ +var data = [ { data: d1, +series: { + lines: { show: true }, + points: { show: true } + }, bars: { show: true } }, - ], - { - + { + data: d2, +series: { + lines: { show: true }, + points: { show: true } + }, + bars: { show: true } + }, + ]; + var options = + { +series: { + stack: true, + }, grid: { hoverable: true, clickable: true, labelMargin: 17 }, + selection: { mode: "x" } + }; + +placeholder.bind("plotselected", function (event, ranges) { + plot = $.plot(placeholder, data, + $.extend(true, {}, options, { + xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to } + })); }); - + var previousPoint = null; + placeholder.bind("plothover", function (event, pos, item) { + $("#x").text(pos.x.toFixed(2)); + $("#y").text(pos.y.toFixed(2)); + + if (item) { + if (previousPoint != item.dataIndex) { + previousPoint = item.dataIndex; + + $("#tooltip").remove(); + var x = item.datapoint[0].toFixed(2), + y = item.datapoint[1].toFixed(2); + + showTooltip(item.pageX, item.pageY, + item.series.label + " of " + x + " = " + y); + } + } + else { + $("#tooltip").remove(); + previousPoint = null; + } + }); + + var plot = $.plot(placeholder, data, + options); }); + 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 } @@ -428,3 +502,4 @@ } ?> +