From: Dan Vanderkam Date: Fri, 4 Sep 2009 02:26:40 +0000 (+0000) Subject: fix grid drawing order bug. update combined. X-Git-Tag: v1.0.0~884 X-Git-Url: https://adrianiainlam.tk/git/?a=commitdiff_plain;h=2ce09b195610a182c6f81cfd3322c4da0ea3b4e0;p=dygraphs.git fix grid drawing order bug. update combined. --- diff --git a/dygraph-canvas.js b/dygraph-canvas.js index 04e1eb1..218d41e 100644 --- a/dygraph-canvas.js +++ b/dygraph-canvas.js @@ -93,11 +93,6 @@ DateGraphCanvasRenderer.prototype = new PlotKit.CanvasRenderer(); * Draw an X/Y grid on top of the existing plot */ DateGraphCanvasRenderer.prototype.render = function() { - // Do the ordinary rendering, as before - // TODO(danvk) Call super.render() - this._renderLineChart(); - this._renderLineAxis(); - // Draw the new X/Y grid var ctx = this.element.getContext("2d"); if (this.options.drawYGrid) { @@ -131,6 +126,11 @@ DateGraphCanvasRenderer.prototype.render = function() { ctx.stroke(); } } + + // Do the ordinary rendering, as before + // TODO(danvk) Call super.render() + this._renderLineChart(); + this._renderLineAxis(); }; /** diff --git a/dygraph-combined.js b/dygraph-combined.js index 2867e8c..a2772ca 100644 --- a/dygraph-combined.js +++ b/dygraph-combined.js @@ -4649,8 +4649,6 @@ this.options.drawBackground=false; }; DateGraphCanvasRenderer.prototype=new PlotKit.CanvasRenderer(); DateGraphCanvasRenderer.prototype.render=function(){ -this._renderLineChart(); -this._renderLineAxis(); var ctx=this.element.getContext("2d"); if(this.options.drawYGrid){ var _14=this.layout.yticks; @@ -4682,6 +4680,8 @@ ctx.closePath(); ctx.stroke(); } } +this._renderLineChart(); +this._renderLineAxis(); }; DateGraphCanvasRenderer.prototype._renderLineChart=function(){ var _17=this.element.getContext("2d"); @@ -4783,7 +4783,7 @@ DateGraph.DEFAULT_WIDTH=480; DateGraph.DEFAULT_HEIGHT=320; DateGraph.DEFAULT_STROKE_WIDTH=1; DateGraph.AXIS_LINE_WIDTH=0.3; -DateGraph.DEFAULT_ATTRS={highlightCircleSize:3,pixelsPerXLabel:60,labelsDivWidth:250,labelsDivStyles:{}}; +DateGraph.DEFAULT_ATTRS={highlightCircleSize:3,pixelsPerXLabel:60,pixelsPerYLabel:30,labelsDivWidth:250,labelsDivStyles:{}}; DateGraph.prototype.__init__=function(div,_52,_53,_54){ this.maindiv_=div; this.labels_=_53; @@ -4800,7 +4800,6 @@ this.valueRange_=_54.valueRange||null; this.labelsSeparateLines=_54.labelsSeparateLines||false; this.labelsDiv_=_54.labelsDiv||null; this.labelsKMB_=_54.labelsKMB||false; -this.minTickSize_=_54.minTickSize||0; this.xValueParser_=_54.xValueParser||DateGraph.prototype.dateParser; this.xValueFormatter_=_54.xValueFormatter||DateGraph.prototype.dateString_; this.xTicker_=_54.xTicker||DateGraph.prototype.dateTicker; @@ -5240,86 +5239,91 @@ return this.GetXAxis(_152,_153,_154); } }; DateGraph.prototype.numericTicks=function(minV,maxV){ -var _158; -if(maxV<=0){ -_158=1; -}else{ -_158=Math.pow(10,Math.floor(Math.log(maxV)/Math.log(10))); +var _158=[1,2,5]; +var _159,low_val,high_val,nTicks; +for(var i=-10;i<50;i++){ +var _160=Math.pow(10,i); +for(var j=0;j<_158.length;j++){ +_159=_160*_158[j]; +low_val=Math.floor(minV/_159)*_159; +high_val=Math.ceil(maxV/_159)*_159; +nTicks=(high_val-low_val)/_159; +var _161=this.height_/nTicks; +if(_161>this.attrs_.pixelsPerYLabel){ +break; } -var _159=(maxV-minV)/_158; -while(2*_159<20){ -_159*=2; } -if((maxV-minV)/_159this.attrs_.pixelsPerYLabel){ +break; } -var _160=[]; -for(var i=0;i<=_159;i++){ -var _161=minV+i*(maxV-minV)/_159; -var _162=this.round_(_161,2); +} +var _162=[]; +for(var i=0;i=k*k*k){ -_162=this.round_(_161/(k*k*k),1)+"B"; +if(_163>=k*k*k){ +_164=this.round_(_163/(k*k*k),1)+"B"; }else{ -if(_161>=k*k){ -_162=this.round_(_161/(k*k),1)+"M"; +if(_163>=k*k){ +_164=this.round_(_163/(k*k),1)+"M"; }else{ -if(_161>=k){ -_162=this.round_(_161/k,1)+"K"; +if(_163>=k){ +_164=this.round_(_163/k,1)+"K"; } } } } -_160.push({label:_162,v:_161}); +_162.push({label:_164,v:_163}); } -return _160; +return _162; }; DateGraph.prototype.addYTicks_=function(minY,maxY){ -var _166=this.numericTicks(minY,maxY); -this.layout_.updateOptions({yAxis:[minY,maxY],yTicks:_166}); +var _168=this.numericTicks(minY,maxY); +this.layout_.updateOptions({yAxis:[minY,maxY],yTicks:_168}); }; DateGraph.prototype.drawGraph_=function(data){ var maxY=null; this.layout_.removeAllDatasets(); for(var i=1;i=low&&_167[k][0]<=high){ -_171.push(_167[k]); -var y=bars?_167[k][1][0]:_167[k][1]; +var _173=[]; +for(var k=0;k<_169.length;k++){ +if(_169[k][0]>=low&&_169[k][0]<=high){ +_173.push(_169[k]); +var y=bars?_169[k][1][0]:_169[k][1]; if(maxY==null||y>maxY){ maxY=y; } } } -_167=_171; +_169=_173; }else{ -for(var j=0;j<_167.length;j++){ -var y=bars?_167[j][1][0]:_167[j][1]; +for(var j=0;j<_169.length;j++){ +var y=bars?_169[j][1][0]:_169[j][1]; if(maxY==null||y>maxY){ -maxY=bars?y+_167[j][1][1]:y; +maxY=bars?y+_169[j][1][1]:y; } } } if(bars){ var vals=[]; -for(var j=0;j<_167.length;j++){ -vals[j]=[_167[j][0],_167[j][1][0],_167[j][1][1],_167[j][1][2]]; +for(var j=0;j<_169.length;j++){ +vals[j]=[_169[j][0],_169[j][1][0],_169[j][1][1],_169[j][1][2]]; } this.layout_.addDataset(this.labels_[i-1],vals); }else{ -this.layout_.addDataset(this.labels_[i-1],_167); +this.layout_.addDataset(this.labels_[i-1],_169); } } if(this.valueRange_!=null){ @@ -5328,9 +5332,6 @@ this.addYTicks_(this.valueRange_[0],this.valueRange_[1]); maxY*=1.1; if(maxY<=0){ maxY=1; -}else{ -var _173=Math.pow(10,Math.floor(Math.log(maxY)/Math.log(10))); -maxY=_173*Math.ceil(maxY/_173); } this.addYTicks_(0,maxY); } @@ -5340,44 +5341,44 @@ this.plotter_.clear(); this.plotter_.render(); this.canvas_.getContext("2d").clearRect(0,0,this.canvas_.width,this.canvas_.height); }; -DateGraph.prototype.rollingAverage=function(_174,_175){ -if(_174.length<2){ -return _174; +DateGraph.prototype.rollingAverage=function(_175,_176){ +if(_175.length<2){ +return _175; } -var _175=Math.min(_175,_174.length-1); -var _176=[]; -var _177=this.sigma_; +var _176=Math.min(_176,_175.length-1); +var _177=[]; +var _178=this.sigma_; if(this.fractions_){ var num=0; var den=0; var mult=100; -for(var i=0;i<_174.length;i++){ -num+=_174[i][1][0]; -den+=_174[i][1][1]; -if(i-_175>=0){ -num-=_174[i-_175][1][0]; -den-=_174[i-_175][1][1]; -} -var date=_174[i][0]; -var _180=den?num/den:0; +for(var i=0;i<_175.length;i++){ +num+=_175[i][1][0]; +den+=_175[i][1][1]; +if(i-_176>=0){ +num-=_175[i-_176][1][0]; +den-=_175[i-_176][1][1]; +} +var date=_175[i][0]; +var _181=den?num/den:0; if(this.errorBars_){ if(this.wilsonInterval_){ if(den){ -var p=_180<0?0:_180,n=den; -var pm=_177*Math.sqrt(p*(1-p)/n+_177*_177/(4*n*n)); -var _183=1+_177*_177/den; -var low=(p+_177*_177/(2*den)-pm)/_183; -var high=(p+_177*_177/(2*den)+pm)/_183; -_176[i]=[date,[p*mult,(p-low)*mult,(high-p)*mult]]; +var p=_181<0?0:_181,n=den; +var pm=_178*Math.sqrt(p*(1-p)/n+_178*_178/(4*n*n)); +var _184=1+_178*_178/den; +var low=(p+_178*_178/(2*den)-pm)/_184; +var high=(p+_178*_178/(2*den)+pm)/_184; +_177[i]=[date,[p*mult,(p-low)*mult,(high-p)*mult]]; }else{ -_176[i]=[date,[0,0,0]]; +_177[i]=[date,[0,0,0]]; } }else{ -var _184=den?_177*Math.sqrt(_180*(1-_180)/den):1; -_176[i]=[date,[mult*_180,mult*_184,mult*_184]]; +var _185=den?_178*Math.sqrt(_181*(1-_181)/den):1; +_177[i]=[date,[mult*_181,mult*_185,mult*_185]]; } }else{ -_176[i]=[date,mult*_180]; +_177[i]=[date,mult*_181]; } } }else{ @@ -5385,157 +5386,157 @@ if(this.customBars_){ var low=0; var mid=0; var high=0; -var _186=0; -for(var i=0;i<_174.length;i++){ -var data=_174[i][1]; +var _187=0; +for(var i=0;i<_175.length;i++){ +var data=_175[i][1]; var y=data[1]; -_176[i]=[_174[i][0],[y,y-data[0],data[2]-y]]; +_177[i]=[_175[i][0],[y,y-data[0],data[2]-y]]; low+=data[0]; mid+=y; high+=data[2]; -_186+=1; -if(i-_175>=0){ -var prev=_174[i-_175]; +_187+=1; +if(i-_176>=0){ +var prev=_175[i-_176]; low-=prev[1][0]; mid-=prev[1][1]; high-=prev[1][2]; -_186-=1; +_187-=1; } -_176[i]=[_174[i][0],[1*mid/_186,1*(mid-low)/_186,1*(high-mid)/_186]]; +_177[i]=[_175[i][0],[1*mid/_187,1*(mid-low)/_187,1*(high-mid)/_187]]; } }else{ -var _188=Math.min(_175-1,_174.length-2); +var _189=Math.min(_176-1,_175.length-2); if(!this.errorBars_){ -for(var i=0;i<_188;i++){ +for(var i=0;i<_189;i++){ var sum=0; for(var j=0;j