Question

我正在运行一个小函数来使用d3创建一个图形，我试图用数字0-5填充一个数字，增量为0.2（所以0,0.2,0.4等最多为5）。我不能只创建一个等于0的变量并且每次都加0.2，因为javascript会使值与[0,0.2,0.2999999999999999999等]的数字混乱。所以我必须使用对数字对象进行操作的toFixed（）方法。在我的ocde中，我声明一个等于0的变量然后启动一个for循环并尝试在循环开头的数字上使用toFixed函数。然后Firebug告诉我num.toFixed不是一个函数 - 我意识到这是因为我的for循环（在num的声明之后启动）在num声明之前执行。如何强制javascript在我接收之后运行for循环变量声明？

这是我的功能：

function createGraph(stall, ovl, swda)
{
var svg = d3.select("#infoGraph").append("svg");

svg.attr("width", 604).attr("height", 500);
svg.append("line").attr("x1", 104).attr("y1", 4).attr("x2", 104).attr("y2", 404).attr("stroke", "black");
svg.append("line").attr("x1", 104).attr("y1", 404).attr("x2", 504).attr("y2", 404).attr("stroke", "black");
svg.append("rect").attr("x", 125).attr("y", (404-(stall)*100)).attr("width", 75).attr("height", (stall*100)).attr("fill", "orange").attr("opacity", 0.5);
svg.append("rect").attr("x", 250).attr("y", (404-(ovl)*100)).attr("width", 75).attr("height", (ovl*100)).attr("fill", "orange").attr("opacity", 0.5);
svg.append("rect").attr("x", 375).attr("y", (404-(swda)*100)).attr("width", 75).attr("height", (swda*100)).attr("fill", "orange").attr("opacity", 0.5);

    //ISSUE OCCURS HERE
var dataset = [];
var legendValue = 10;
var tempVal;
console.log("Before for loop"); //this shows up after my console.log statement within the for loop in firebug's web console.
for(i=0;i<26;i++)
{
    tempVal = legendValue.toFixed(1); //I get an error here
    legendValue = tempVal;
    dataset.push(legendValue);
    console.log(legendValue);

}
}

主码体！ - 在底部声明的函数

$(document).ready(function(){
//alert("Script ran");
//d3.select("body").append("p").text("D3 Tests Inbound");
w = 500;
h = 50;

var dataset = [];
for(i=0; i<25; i++)
{
    var randomNum=Math.random() * 30;
    var roundedNum = Math.round(randomNum);
    dataset.push(randomNum);
}

var dataset2 = [5, 10, 15, 20, 25];

d3.select("#randomGraph")
    .selectAll("div")
    .data(dataset)
    .enter()
    .append("div")
    .attr("class", "bar")
    .style("height", function(d){
        var barHeight = 5*d;
        return barHeight + "px"
    })
    .style("margin", "5px");

    var svg = d3.select("#svgGraph").append("svg");
    svg.attr("width", w)
        .attr("height", h);

    var circles = svg.selectAll("circle")
        .data(dataset2)
        .enter()
        .append("circle");

    circles.attr("cx", function(d, i){
        return (i*50)+25;
    })
    .attr("cy", h/2)
    .attr("r", function(d){
        return d;
    });

    var stall, ovl, swda;
    stall = 3.3;
    ovl = 0.8;
    swda = 3;

    createGraph(3.3, 0.8, 3);

});

Firebug输出：

[13：04：19.214]未知财产'盒子大小'。声明被撤销。

[13：04：19.220] TypeError：legendValue.toFixed不是函数

[13：04：19.220]在循环之前

[13：04：19.220] 10.0

Answer 1

LegendValue是第一次循环之前的数字，然后在循环中将其更改为字符串：legendValue = "" + tempVal + "";。一旦它是一个字符串，.toFixed函数就不再是一个有效的选项。

jsfiddle attached与typeof

进行演示附加

second jsfiddle演示使用完整代码。图表看起来有点滑稽，但它有效。请注意，我没有在循环中将字符串值赋给legendValue，而是将字符串tempVal推送到数据集上。

尽管没有运行异步函数，但按顺序执行Javascript

1 个答案: