Commits

Chris Leonello committed a8b4e1d

Fix for date axes and zoooming. Update css for better tick display. Updating examples.

Comments (0)

Files changed (5)

examples/barTest.html

         var ticks = ['a', 'b', 'c', 'd'];
         
         plot1 = $.jqplot('chart1', [s1], {
-            // Only animate if we're not using excanvas (not in IE 7 or IE 8).
-            // excanvas is too slow to handle this many animations.
+            // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
             animate: !$.jqplot.use_excanvas,
             seriesDefaults:{
                 renderer:$.jqplot.BarRenderer,
         var ticks = ['a', 'b', 'c', 'd'];
         
         plot2 = $.jqplot('chart2', [s1, s2], {
-            // Only animate if we're not using excanvas (not in IE 7 or IE 8).
-            // excanvas is too slow to handle this many animations.
             seriesDefaults: {
                 renderer:$.jqplot.BarRenderer,
                 pointLabels: { show: true }
     
   <script class="code" type="text/javascript">$(document).ready(function(){
         plot2b = $.jqplot('chart2b', [[[2,1], [4,2], [6,3], [3,4]], [[5,1], [1,2], [3,3], [4,4]], [[4,1], [7,2], [1,3], [2,4]]], {
-            // Only animate if we're not using excanvas (not in IE 7 or IE 8).
-            // excanvas is too slow to handle this many animations.
             seriesDefaults: {
                 renderer:$.jqplot.BarRenderer,
                 pointLabels: { show: true, location: 'e', edgeTolerance: -15 },
         var s2 = [7, 5, 3, 2];
         var s3 = [14, 9, 3, 8];
         plot3 = $.jqplot('chart3', [s1, s2, s3], {
-            // Only animate if we're not using excanvas (not in IE 7 or IE 8).
-            // excanvas is too slow to handle this many animations.
             stackSeries: true,
             captureRightClick: true,
             seriesDefaults:{
     
   <script class="code" type="text/javascript">$(document).ready(function(){
         plot4 = $.jqplot('chart4', [[[2,1], [6,2], [7,3], [10,4]], [[7,1], [5,2],[3,3],[2,4]], [[14,1], [9,2], [9,3], [8,4]]], {
-            // Only animate if we're not using excanvas (not in IE 7 or IE 8).
-            // excanvas is too slow to handle this many animations.
             stackSeries: true,
             captureRightClick: true,
             seriesDefaults:{
     
   <script class="code" type="text/javascript">$(document).ready(function(){
         plot5 = $.jqplot('chart5', [[[2,1], [null,2], [7,3], [10,4]]], {
-            // Only animate if we're not using excanvas (not in IE 7 or IE 8).
-            // excanvas is too slow to handle this many animations.
             captureRightClick: true,
             seriesDefaults:{
                 renderer:$.jqplot.BarRenderer,
 		var ticks = ['a', 'b', 'c', 'd'];
 
 		plot7 = $.jqplot('chart7', [s1], {
-            // Only animate if we're not using excanvas (not in IE 7 or IE 8).
-            // excanvas is too slow to handle this many animations.
 			seriesDefaults:{
 				renderer:$.jqplot.BarRenderer,
 				rendererOptions: { fillToZero: true },

examples/dateAxisRenderer.html

                 }
             },
             yaxis: {
-                tickOptions:{formatString:'%.2f'}
+                tickOptions:{
+                    prefix: '$'
+                }
             }
         },
         series: [
                 }
             },
             yaxis: {
-                tickOptions:{formatString:'%.2f'}
+                tickOptions:{
+                    prefix: '$'
+                }
             }
         },
         series: [
     <?php include "topbanner.inc"; ?>
     <div class="example-content">
     <?php include "nav.inc"; ?>
+<p class="text">Date axis renderer with default settings.  Ticks are given wider spacing by default since date axes typically have longer tick labels.</p>
 <div id="chart1" style="margin:20px;height:240px; width:640px;"></div>
+<p class="text">Date axis recognizes rotated tick labels.  It will space ticks a little closer when labels are rotated.</p>
 <div id="chart2" style="margin:20px;height:240px; width:640px;"></div>
+<p class="text">If you want more or less ticks, specify the "numberTicks" options.  Date axes will try to produce the desired number of ticks, but may adjust to get a nice interval.</p>
 <div id="chart3" style="margin:20px;height:240px; width:640px;"></div>
   
   </div>

src/jquery.jqplot.css

 /*rules applied to all axis tick divs*/
 .jqplot-axis-tick, .jqplot-xaxis-tick, .jqplot-yaxis-tick, .jqplot-x2axis-tick, .jqplot-y2axis-tick, .jqplot-y3axis-tick, .jqplot-y4axis-tick, .jqplot-y5axis-tick, .jqplot-y6axis-tick, .jqplot-y7axis-tick, .jqplot-y8axis-tick, .jqplot-y9axis-tick, .jqplot-yMidAxis-tick {
     position: absolute;
+    white-space: pre;
 }
 
 

src/plugins/jqplot.cursor.js

                                 axes[ax].min = newmin;
                                 axes[ax].max = newmax;
                                 axes[ax].tickInterval = null;
+                                axes[ax].numberTicks = null;
                                 // for date axes...
                                 axes[ax].daTickInterval = null;
                             }

src/plugins/jqplot.dateAxisRenderer.js

     // array of consistent nice intervals.  Longer intervals
     // will depend on days in month, days in year, etc.
     var niceFormatStrings = ['%M:%S.%#N', '%M:%S.%#N', '%M:%S.%#N', '%M:%S', '%M:%S', '%M:%S', '%M:%S', '%H:%M:%S', '%H:%M:%S', '%H:%M', '%H:%M', '%H:%M', '%H:%M', '%H:%M', '%H:%M', '%a %H:%M', '%a %H:%M', '%b %e %H:%M', '%b %e %H:%M', '%b %e %H:%M', '%b %e %H:%M', '%v', '%v', '%v', '%v', '%v', '%v', '%v'];
-    var niceIntervalBases = [second, second, second, second, second, second, second, second, second, minute, minute, minute, minute, minute, minute, hour, hour, hour, hour, hour, hour, day, week, week];
     var niceIntervals = [0.1*second, 0.2*second, 0.5*second, second, 2*second, 5*second, 10*second, 15*second, 30*second, minute, 2*minute, 5*minute, 10*minute, 15*minute, 30*minute, hour, 2*hour, 4*hour, 6*hour, 8*hour, 12*hour, day, 2*day, 3*day, 4*day, 5*day, week, 2*week];
 
     var niceMonthlyIntervals = []
             if (temp < badness) {
                 badness = temp;
                 bestTi = niceIntervals[i];
-                bestTiBase = niceIntervalBases[i];
                 bestfmt = niceFormatStrings[i];
             }
         }