0

私はjavascriptでJavascriptグラフ作成ライブラリに取り組んでおり、グリッドを描画する関数を持っています。各グリッド線には1つの色があり、軸には別の色があります。関連するコードは、この jsfiddle http://jsfiddle.net/F5LPn/#run
にあります。呼び出されているメイン メソッドは、上部をロードする必要があるため、下部にあります。

var ctx=document.getElementById('canvas').getContext('2d');
ctx.line(0,0,5,5);
ctx.lineWidth=1;
ctx.setGraph(-10,10,-10,10,1,1);
ctx.drawGraph('lightgrey','black');
ctx.strokeStyle='pink';
ctx.line(0,0,5,5);

drawGraph メソッドはこのコードを使用します

CanvasRenderingContext2D.prototype.drawGraph=function(color,axiscolor){
alert('called!');
this.strokeStyle=color;
for(var i=this.xmin;i<=this.xmax;i+=this.xscl){
    this.line(i,this.xmin,i,this.xmax);
}
for(var j=this.ymin;j<=this.ymax;j+=this.yscl){
    this.line(this.ymin,j,this.ymax,j);
}
//  this.strokeStyle=axiscolor;
this.line(0,this.xmin,0,this.xmax);
this.line(this.ymin,0,this.ymax,0);
this.strokeStyle=color;
};

ご覧のとおり、少なくとも私のブラウザでは、drawgraph が呼び出された後にストローク スタイルが緑に設定されていても、グリッド全体が緑に着色されています。なぜこれが起こっているのか分かりません

ありがとう

4

2 に答える 2