Di chuyển các nút cố định trong D3

Question

Tôi có các nút trong bố cục hướng lực D3 được đặt thành. cố định = true. Nếu tôi đặt giá trị .x hoặc .y, các nút sẽ không di chuyển đến vị trí mới của chúng.

Dưới đây là chức năng của tôi:

function fixNode(idArray, locationX, locationY) { 
    for (x = 0; x < idArray.length; x++) { 
     for (y = 0; y < nodes.length; y++) { 
      if (nodes[y].id == idArray[x]) { 
       nodes[y].fixed = true; 
       nodes[y].x = 50; 
       nodes[y].y = 50; 
       break; 
      } 
     } 
    } 
} 

UPDATE 1:

Dưới đây là chức năng làm việc dựa trên lời khuyên của Jason:

function fixNode(idArray, locationX, locationY) { 
    for (x = 0; x < idArray.length; x++) { 
     for (y = 0; y < nodes.length; y++) { 
      if (nodes[y].id == idArray[x]) { 
       nodes[y].fixed = true; 
       nodes[y].x = 50; 
       nodes[y].y = 50; 
       nodes[y].px = 50; 
       nodes[y].py = 50; 
       break; 
      } 
     } 
    } 
    tick(); 
} 

Answer 1

Việc bố trí lực lượng hướng được tách rời khỏi dựng hình thực tế. Thông thường bạn có một trình điều khiển đánh dấu, cập nhật các thuộc tính của các phần tử SVG của bạn cho mỗi "đánh dấu" của thuật toán bố cục (điều tốt đẹp về tách là bạn thay vào đó là <canvas>, hoặc cái gì khác).

Vì vậy, để trả lời câu hỏi của bạn, bạn chỉ cần gọi trực tiếp trình xử lý này để cập nhật các thuộc tính của các phần tử SVG của bạn. Ví dụ, mã của bạn có thể trông như thế này:

var node = …; // append circle elements 

var force = d3.layout.force() 
    .nodes(…) 
    .links(…) 
    .on("tick", tick) 
    .start(); 

function tick() { 
    // Update positions of circle elements. 
    node.attr("cx", function(d) { return d.x; }) 
     .attr("cy", function(d) { return d.y; }); 
} 

Vì vậy, bạn chỉ đơn giản là có thể gọi tick() bất cứ lúc nào và cập nhật vị trí phần tử.

Bạn có thể bị cám dỗ gọi force.tick(), nhưng điều này có nghĩa là được sử dụng thay thế đồng bộ cho force.start(): bạn có thể gọi liên tục và mỗi cuộc gọi thực hiện một bước của thuật toán bố cục. Tuy nhiên, có một biến số alpha bên trong được sử dụng để điều khiển quá trình ủ mô phỏng được sử dụng trong nội bộ và khi bố cục "nguội", biến này sẽ là 0 và các cuộc gọi khác đến force.tick() sẽ không có hiệu lực. (Phải thừa nhận rằng nó có thể là tốt đẹp nếu force.tick() luôn luôn bắn một sự kiện đánh dấu bất kể làm mát, nhưng đó không phải là hành vi hiện tại).

Như bạn đã nói một cách chính xác trong các ý kiến, nếu bạn tự đặt d.x và d.y, bạn cũng nên thiết lập d.px và d.py với các giá trị tương tự nếu bạn muốn nút duy trì ở một vị trí nhất định.