Uncaught TypeError: Cannot read property 'size' of undefined
suchetaswabhav opened this issue · 1 comments
suchetaswabhav commented
I am implementing Venn diagram using d3 venn in my angular2+ application.
I am getting a proper result when i select an api object that has sets has 3 items inside it. It is giving error -
Uncaught TypeError: Cannot read property 'size' of undefined
when my sets has 6 items.
Code -
venn.example.js
var sets;
sets = JSON.parse(localStorage.getItem("sets"));
console.log("sets=",sets)
console.log("sets.length = ", sets.length)
var lengthWidthHeights = [
// min, max, width, height
[0, 24, 500, 500],
[25, 50, 1000, 800],
[51, 100, 1300, 1300],
[101, 150, 1500, 1600],
[151, 250, 1700, 1900],
[251, 350, 2000, 2500],
[351, 450, 2500, 3000],
[451, 550, 3000, 3500]
];
var { length } = sets;
console.log("length =", length);
var chart;
var foundItem = lengthWidthHeights.find(([min, max]) => length >=
min && length <= max);
if (foundItem) {
console.log("inside foundItem =", foundItem);
const [,,width, height] = foundItem;
chart = venn.VennDiagram().width(width).height(height);
}
d3.select("#venn").datum(sets).call(chart);
app.component.ts
callFunctionSingleSelectedResult(trueNodesObject) {
this.showVennDiagram = true;
console.log("nodesObj =", trueNodesObject);
// JSON.stringify
return new Promise((resolve, reject) => {
this.http.get("http://localhost:3003/seekIntersection/nodesObj/" + JSON.stringify(trueNodesObject))
.map(Response => Response)
.catch((err) => {
console.log("err =", err)
return Observable.throw(err);
})
.subscribe((res: Response) => {
this.nodesInfoSingular = res;
this.nodesLengthSingular = this.nodesInfoSingular.records.length
// combination formula to be applied
else if (this.nodesLengthSingular > 2) {
var j = 2;
for (var i = 0; i < this.nodesLengthSingular; i++) {
this.allNodesSingularTotalSelect.push(this.nodesInfoSingular.records[i]._fields[0].properties.name)
}
var array = this.allNodesSingularTotalSelect;
var results = [];
// Since you only want pairs, there's no reason
// to iterate over the last element directly
for (var i = 0; i < array.length - 1; i++) {
// This is where you'll capture that last value
for (var j = i + 1; j < array.length; j++) {
console.log("this.allNodesSingularTotalSelect =", this.allNodesSingularTotalSelect);
this.allNodesSingularSelect.push({ sets: [array[i]], size: 12 })
this.allNodesSingularSelect.push({ sets: [array[i], array[j]], size: 2 })
console.log("this.allNodesSingularSelect ,its .push= ", this.allNodesSingularSelect);
}
}
console.log(results);
}
resolve(this.allNodesSingularSelect)
}
});
});
console.log("return this.allNodesSingularSelect =",
this.allNodesSingularSelect)
}
Output in console -
sets= (6) [{…}, {…}, {…}, {…}, {…}, {…}]
0: {sets: Array(1), size: 12}
1: {sets: Array(2), size: 2}
2: {sets: Array(1), size: 12}
3: {sets: Array(2), size: 2}
4: {sets: Array(1), size: 12}
5: {sets: Array(2), size: 2}
length: 6_
_proto__: Array(0)
sets.length = 6
length = 6
inside foundItem = (4) [0, 24, 500, 500]
Uncaught TypeError: Cannot read property 'size' of undefined
Reference -
http://jsfiddle.net/suchetacateina/h04sknus/518/
suchetaswabhav commented
I found out the answer -
I forgot putting sets value inside square [ ] brackets.
this.allNodesSingularSelect.push({ sets: [this.nodesInfoSingular.records[i]._fields[0].properties.name], size: 12 })