0

I am having a hard time figuring out this piece of code marked in bold. Can some explain me those lines please

function growBars() {
    var barStartX = 0;
    var barStartY = 0;
    var barHeight = 0;
    var barValue = 0;

    <!-- ********** Start Unable to understand -->
    barValue = parseInt(chartData.bars[i].value);
    barHeight = (barValue * chartHeight / maxValue) / numSteps * idxStep;
    barStartX = chartMargin + chartAxisSpace + (i * (barWidth + barMargin)) + barMargin;
    barStartY = chartMargin + (chartHeight - barHeight);
    drawBar(barStartX, barStartY, barWidth, barHeight);
}
if (idxStep < numSteps) {
    idxStep++;
    setTimeout('growBars()', growSpeed);
}
} < -- * * * * * * * * * * * * * End till here-- >

function drawBar(barX, barY, barW, barH) {
    context.fillStyle = '#00c';
    context.fillRect(barX, barY, barW, barH);
    context.shadowOffsetX = 3;
    context.shadowOffsetY = -3;
    context.shadowBlur = 3;
    context.shadowColor = 'rgba(200, 200, 200, .3)';
    context.strokeStyle = '#000';
    context.lineWidth = 1;
    context.strokeRect(barX, barY, barW, barH);
}

As you can see the above code draws bars on a graph. What I am unable to understand is the way this recursive function is used. What does that piece of code do?

4

1 に答える 1

0 
1. barValue = parseInt(chartData.bars[i].value);
2. barHeight = (barValue * chartHeight / maxValue) / numSteps * idxStep;
3. barStartX = chartMargin + chartAxisSpace + (i * (barWidth + barMargin)) + barMargin;
4. barStartY = chartMargin + (chartHeight-barHeight);
5. drawBar(barStartX, barStartY, barWidth, barHeight);
  1. chartData.bars[i].value を整数に変換します
  2. バーの高さを設定します。numSteps または idxStep が 3/4 であることがわかりません。バーの x、y 開始座標を設定します
  3. 上記で計算された値で drawBar 関数を呼び出します。

データの増加を示すグラフを計画しない限り、関数へのリコールは必要ありませんが、再帰的ではありません

function growBars() { //START OF FUNCTION
    var barStartX = 0;
    var barStartY = 0;
    var barHeight = 0;
    var barValue = 0;

    <!-- ********** Start Unable to understand -->
    barValue = parseInt(chartData.bars[i].value);
    barHeight = (barValue * chartHeight / maxValue) / numSteps * idxStep;
    barStartX = chartMargin + chartAxisSpace + (i * (barWidth + barMargin)) + barMargin;
    barStartY = chartMargin + (chartHeight - barHeight);
    drawBar(barStartX, barStartY, barWidth, barHeight);
} //END OF FUNCTION
if (idxStep < numSteps) { //START OF IF STATEMENT
    idxStep++;
    setTimeout('growBars()', growSpeed);
} //END OF IF STATEMENT
} < -- * * * * * * * * * * * * * End till here-- > // UNPAIRED CLOSE BRACKET

function drawBar(barX, barY, barW, barH) {
    context.fillStyle = '#00c';
    context.fillRect(barX, barY, barW, barH);
    context.shadowOffsetX = 3;
    context.shadowOffsetY = -3;
    context.shadowBlur = 3;
    context.shadowColor = 'rgba(200, 200, 200, .3)';
    context.strokeStyle = '#000';
    context.lineWidth = 1;
    context.strokeRect(barX, barY, barW, barH);
}

私のコメントからわかるように、グローバーはそれ自体から呼び出されないため、再帰的ではありません

于 2012-06-09T13:15:55.900 に答える