首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Javascript/D3.js中未定义或空引用的属性“value”

Javascript/D3.js中未定义或空引用的属性“value”
EN

Stack Overflow用户
提问于 2018-04-07 09:50:21
回答 1查看 340关注 0票数 0

我有一个相当大的程序的下面的代码(请参阅下文)。

我有一个按钮,它调用脚本/方法(updateChart())来创建D3.js图表。如果我用静态变量初始化图表,图表类就能工作。但是,创建D3图表的类在尝试传递我预先通过javascript代码创建的数据集时会引发以下错误:

SCRIPT5007:Unable to get property 'value' of undefined or null reference

问题是:我如何才能摆脱这个错误,让我的updateChart()方法处理好数据集?

奇怪的是,在将dataset变量传递给D3.js类之前,我会在控制台中打印出该对象。在那里,一切看起来都很好,对于每一个属性,我都有一个值,并且对象是正确的。

我不明白的是,当对象通过updateChart()传递到D3.js类并在那里进行处理时,它似乎有赋值给属性的空值,而在前面的行( console.log())中,对象似乎没有问题。

代码语言:javascript
复制
//Button to create a D3.js chart with a custom dataset called waterdata
 <script>
     $("#testButton2").click(function () {
        /////
        console.log("click update chart 2")
        console.log(waterdata); //--> print JSO fine and without errors
        console.log(JSON.stringify(waterdata)); //--> Prints JSO fine truncated in IE but without error
        $(".chart").empty(); //--> clear chart container, if chart already there

        updateChart(waterdata, ".chart"); //--> here somehow the object seems broken

});
</script>


//The method / line of the error as shown in console
function add_to_stack(data, year, stack_year, direction,   query_direction, categories, count, x_pos, y_pos) {

 var new_list = [], current_data = {};

var fill_colors = { start: "#054696", in1: "#587521", in2: "#587521", out1: "#e63e2e", out2: "#e63e2e" };

current_data = data.filter(function (d) { return d.Year == year && d.Direction == query_direction });
for (c in categories) {
    //Für jede Kategorie eine Row
    if (direction == "down") {
        //für down y_pos Subtraktion erfolgt zuerst
        y_pos -= current_data[0][categories[c]];
    }
    new_list.push({  // --> this is indicated as error line in the console
        stack: stack_year + "_" + direction,
        increment: count,
        category: categories[c],
        value: current_data[0][categories[c]],
        position: y_pos,
        state: current_data[0].State,
        year: year,
        fill_color: fill_colors[query_direction],
        x_pos: x_pos
    });
    if (direction == "up") {
        //für up y pos anschliessend addieren
        y_pos += current_data[0][categories[c]];
    }
    count += 1;
};
return [new_list, count, y_pos];
}

数据就是这样创建的。小写变量是在代码中预先创建的值。在将数据集传递给D3方法之前,它们都应该很好地工作,就像在conosle中打印出来时一样,所有的值都显示得很好。

代码语言:javascript
复制
//structure of the data
//created by complex calculation in dataSetCreation.js
waterdata = [
    {
    Year: "2016",
    Direction: "start",
    State: "31.12.2015",
    Wes_3J: wes_3J_2015_c,
    Wes_2_3J: wes_2_3J_2015_c,
    Wes_1_2J: wes_1_2J_2015_c,
    Wes_0_1J: wes_0_1J_2015_c,
    Mod_3J: mod_3J_2015_c,
    Mod_2_3J: mod_2_3J_2015_c,
    Mod_1_2J: mod_1_2J_2015_c,
    Mod_0_1J: mod_0_1J_2015_c
},
{
    Year: "2016",
    Direction: "in1",
    State: "reopened",
    Wes_3J: wes_3J_off_2016_c,
    Wes_2_3J: wes_2_3J_off_2016_c,
    Wes_1_2J: wes_1_2J_off_2016_c,
    Wes_0_1J: wes_0_1J_off_2016_c,
    Mod_3J: mod_3J_off_2016_c,
    Mod_2_3J: mod_2_3J_off_2016_c,
    Mod_1_2J: mod_1_2J_off_2016_c,
    Mod_0_1J: mod_0_1J_off_2016_c
}
,
{
    Year: "2016",
    Direction: "in2",
    State: "new",
    Wes_3J: wes_3J_new_2016_c,
    Wes_2_3J: wes_2_3J_new_2016_c,
    Wes_1_2J: wes_1_2J_new_2016_c,
    Wes_0_1J: wes_0_1J_new_2016_c,
    Mod_3J: mod_3J_new_2016_c,
    Mod_2_3J: mod_2_3J_new_2016_c,
    Mod_1_2J: mod_1_2J_new_2016_c,
    Mod_0_1J: mod_0_1J_new_2016_c
}
  ,
{
    Year: "2016",
    Direction: "out2",
    State: "Verz",
    Wes_3J: wes_3J_verz_2016_c,
    Wes_2_3J: wes_2_3J_verz_2016_c,
    Wes_1_2J: wes_1_2J_verz_2016_c,
    Wes_0_1J: wes_0_1J_verz_2016_c,
    Mod_3J: mod_3J_verz_2016_c,
    Mod_2_3J: mod_2_3J_verz_2016_c,
    Mod_1_2J: mod_1_2J_verz_2016_c,
    Mod_0_1J: mod_0_1J_verz_2016_c
}
 ,
{
    Year: "2016",
    Direction: "out1",
    State: "Abs",
    Wes_3J: wes_3J_abs_2016_c,
    Wes_2_3J: wes_2_3J_abs_2016_c,
    Wes_1_2J: wes_1_2J_abs_2016_c,
    Wes_0_1J: wes_0_1J_abs_2016_c,
    Mod_3J: mod_3J_abs_2016_c,
    Mod_2_3J: mod_2_3J_abs_2016_c,
    Mod_1_2J: mod_1_2J_abs_2016_c,
    Mod_0_1J: mod_0_1J_abs_2016_c
}];
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-04-11 07:37:02

我再次从头创建了这个对象,重新排列了脚本导入标记,错误就消失了。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/49706045

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档