Commits

Chris Leonello  committed 0734c2f

Enhancing examples.

  • Participants
  • Parent commits 4f5ae1a

Comments (0)

Files changed (2)

File examples/kcp_area.php

         font-size: 0.65em;
         line-height: 1em;
         margin: 0px 0px 10px 15px;
+        border-collapse: collapse;
     }
 
     td.jqplot-table-legend-label {
         border: none;
     }
 
+    tr.jqplot-table-legend td {
+        padding: 2px;
+    }
+
+    .legend-row-highlighted {
+        background-color: #666666;
+    }
+
+    .legend-text-highlighted {
+        color: #ffffff;
+    }
+
     #chart1 {
         width: 96%;
         height: 96%;
             location: 'ne',
             rowSpacing: '0px'
         },
+        axesDefaults: {
+            labelRenderer: $.jqplot.CanvasAxisLabelRenderer
+        },
         axes: {
             xaxis: {
                 pad: 0,
                 ticks: ticks,
+                label: 'Population Vingtile',
                 tickOptions: {
                     showGridline: false
                 }
             yaxis: {
                 min: 0,
                 max: 100,
+                label: 'Share of Item in Total Expenditure',
                 tickOptions: {
-                  showGridline: false
+                  showGridline: false,
+                  suffix: '%'
                 }
             }
         },
     $('div.chart-container').bind('resize', function(event, ui) {
         plot1.replot();
     });
+
+    $('#chart1').bind('jqplotDataHighlight', function(ev, seriesIndex, pointIndex, data) {
+        var idx = 21 - seriesIndex
+        $('tr.jqplot-table-legend').removeClass('legend-row-highlighted');  
+        $('tr.jqplot-table-legend').children('.jqplot-table-legend-label').removeClass('legend-text-highlighted');
+        $('tr.jqplot-table-legend').eq(idx).addClass('legend-row-highlighted'); 
+        $('tr.jqplot-table-legend').eq(idx).children('.jqplot-table-legend-label').addClass('legend-text-highlighted'); 
+    });
+
+    $('#chart1').bind('jqplotDataUnhighlight', function(ev, seriesIndex, pointIndex, data) {
+        $('tr.jqplot-table-legend').removeClass('legend-row-highlighted');  
+        $('tr.jqplot-table-legend').children('.jqplot-table-legend-label').removeClass('legend-text-highlighted');
+    });
 });
 
 </script>
 <!-- Additional plugins go here -->
 
   <script class="include" type="text/javascript" src="jquery-ui/js/jquery-ui.min.js"></script>
+  <script class="include" type="text/javascript" src="../src/plugins/jqplot.canvasTextRenderer.js"></script>
+  <script class="include" type="text/javascript" src="../src/plugins/jqplot.canvasAxisLabelRenderer.js"></script>
 
 <!-- End additional plugins -->
 

File examples/kcp_lorenz.php

     $title = "Lorenz Curves";
     // $plotTargets = array (array('id'=>'chart1', 'width'=>600, 'height'=>400));
 ?>
-<?php include "opener.php"; ?>
+<?php include "openerNoHeader.php"; ?>
 
 <!-- Example scripts go here -->
 
             <div>
                 Data Series:
                 <ul>
-                    <li><input name="dataSeries" value="national" type="checkbox" checked />National</li>
-                    <li><input name="dataSeries" value="urban" type="checkbox" />Urban</li>
-                    <li><input name="dataSeries" value="rural" type="checkbox" />Rural</li>
+                    <li><input class="dataSeries-checkbox" name="dataSeries_national" value="national" type="checkbox" checked />National</li>
+                    <li><input class="dataSeries-checkbox" name="dataSeries_urban" value="urban" type="checkbox" />Urban</li>
+                    <li><input class="dataSeries-checkbox" name="dataSeries_rural" value="rural" type="checkbox" />Rural</li>
                 </ul>
             </div>
 
     // initialize form elements
     // set these before attaching event handlers.
 
-    $("input[type=checkbox][name=dataSeries]").attr("checked", false);
-    $("input[type=checkbox][name=dataSeries][value=national]").attr("checked", true);
+    $("input.dataSeries-checkbox").attr("checked", false);
+    $("input.dataSeries-checkbox[name=dataSeries_national]").attr("checked", true);
 
     $("input[type=radio][name=backgroundColor]").attr("checked", false);
     $("input[type=radio][name=backgroundColor][value=white]").attr("checked", true);
         plot1.replot();
     });
 
-    $("input[type=checkbox][name=dataSeries]").change(function(){ 
+    $("input.dataSeries-checkbox").change(function(){ 
 
-        switch (val) {
-            case "national":
-                plot1.series[0].renderer.shapeRenderer.strokeStyle = "#4bb2c5";
-                plot1.plugins.canvasOverlay.get("line5").options.color = "#4bb2c5";
-                break;
-            case "urban":
-                plot1.series[0].renderer.shapeRenderer.strokeStyle = "#c54b62";
-                plot1.plugins.canvasOverlay.get("line5").options.color = "#c54b62";
-                break;
-            case "rural":
-                plot1.series[0].renderer.shapeRenderer.strokeStyle = "#b2c54b";
-                plot1.plugins.canvasOverlay.get("line5").options.color = "#b2c54b";
-                break;
-            default:
-                plot1.series[0].renderer.shapeRenderer.strokeStyle = "#4bb2c5";
-                plot1.plugins.canvasOverlay.get("line5").options.color = "#4bb2c5";
-                break;
+        plot1.series[0].show = false;
+        plot1.series[1].show = false;
+        plot1.series[2].show = false;
+
+        if ($('input[name=dataSeries_national]').get(0).checked === true) {
+            plot1.series[0].show = true;
         }
 
-        var co = plot1.plugins.canvasOverlay;
-        var x1max = findXValue($("input[type=text][name=userLine1]").val(), dataSets[val])[1][0];
-        co.get("line1").options.xmax = co.get("line3").options.x = x1max;
-        var x2max = findXValue($("input[type=text][name=userLine2]").val(), dataSets[val])[1][0];
-        co.get("line2").options.xmax = co.get("line4").options.x = x2max;
+        if ($('input[name=dataSeries_urban]').get(0).checked === true) {
+            plot1.series[1].show = true;
+        }
 
-        // hack to make sure plot auto computes a new format string if needed.
-        plot1.axes.yaxis.tickOptions.formatString = ''
-        plot1.replot({resetAxes:["yaxis"]});
+        if ($('input[name=dataSeries_rural]').get(0).checked === true) {
+            plot1.series[2].show = true;
+        }
+
+        // var co = plot1.plugins.canvasOverlay;
+        // var x1max = findXValue($("input[type=text][name=userLine1]").val(), dataSets[val])[1][0];
+        // co.get("line1").options.xmax = co.get("line3").options.x = x1max;
+        // var x2max = findXValue($("input[type=text][name=userLine2]").val(), dataSets[val])[1][0];
+        // co.get("line2").options.xmax = co.get("line4").options.x = x2max;
+
+        plot1.replot();
     });
 
     $("input[type=checkbox][name=gridsVertical]").change(function(){