D3.js 노드에서 Ember 데이터 사용 (강제 레이아웃)

노드의 x 및 y 속성을 Ember.js 모델과 연결하려고합니다.D3.js 노드에서 Ember 데이터 사용 (강제 레이아웃)

var nodes = this.get('store').findAll('node').then(function (nodes) { 
      var node = svg.selectAll(".node") 
        .data(nodes) 
        .enter().append("circle") 
        .attr("class", "node") 
        .attr("cx", function (d) { 
         return d.x; 
        }) 
        .attr("cy", function (d) { 
         return d.y; 
        }) 
        .attr("r", 7) 
        .style("fill", function (d) { 
         return fill(1); 
        }) 
        .style("stroke", function (d, i) { 
         return d3.rgb(fill(i)).darker(2); 
        }); 
    });

하지만 콘솔에 Uncaught TypeError: Cannot read property 'x' of undefined 오류가 표시됩니다. 나는 x와 y 값을 모델에 정의했다. 어쩌면 나는 그것을 완전히 잘못하고있다.

기본적으로 내가 원하는 것은 d3 플롯에서 모델의 x 및 y 값을 사용하는 것입니다.

출처

2016-07-13 Chaitanya

''var에 node' 전에'을 console.log (노드), 어떤 일이 발생하면 .data(d3ExpectedFormat)를 시도? –

'Class {__ember1468380916865 : "ember1081", __ember_meta__ : Meta}'가 콘솔에 기록됩니다. – Chaitanya

그래서 데이터가 없습니다. –

DS.Store.findAll은 약속을 되 돌리면 사용하기 전에 해결 될 때까지 기다려야합니다.

this.get('store') 
    .findAll('node') 
    .then(nodes => { 
    let node = svg.selectAll(".node") // rest of your code 
    })

또한

출처

2016-07-13 08:31:58

그러나 그것은 작동하지 않았다. 동일한 오류가 발생하고 var 노드를 로그 할 때 항목 배열을 기록하지 않습니다. 질문을 업데이트했습니다. – Chaitanya

한다고 가정 D3 차트 필요한 형식이 [{'x':'xvalue','y':'yvalue'}]입니다 모델에 정의 된 속성에 액세스 Ember.get를 사용해야합니다. 당신은 노드 객체의 새로운 배열로 변환 및 결과 필요 .. 대신 .data(nodes)의

var d3ExpectedFormat = nodes.map(function(node){ 
return {'x':node.get('x'),'y':node.get('y')}; 
});

이

출처

2016-07-14 06:40:53 kumkanillam

D3.js 노드에서 Ember 데이터 사용 (강제 레이아웃)

답변

관련 문제