0

我很难弄清楚这段以粗体标记的代码。请有人给我解释一下这些台词

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);
}

如您所见，上面的代码在图表上绘制了条形图。我无法理解的是这个递归函数的使用方式。那段代码有什么作用？

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。设置 bar 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 回答