Làm thế nào để áp dụng hai loại khác nhau để lợi thế trong sigma.js

Question

Tôi đang cố gắng để vẽ các cạnh trong một đồ thị sigma.js chấm và cong. Tôi đang sử dụng các plugin customEdgeShapes và curve nhưng tôi không thể kết hợp hai kiểu khác nhau trong cùng một cạnh. Trong thực tế, tôi chỉ có thể áp dụng một phong cách duy nhất để các thuộc tính type:

edge.type = 'curvedArrow'; 

hoặc

edge.type = 'dotted'; 

Làm thế nào tôi có thể áp dụng cả hai phong cách để một cạnh?

Answer 1

Tôi đã sử dụng Sigma.js trong một hoặc hai tuần và nghĩ rằng có một số cách để thực hiện những gì bạn muốn. Tôi đã sử dụng phương pháp này để phân biệt các nút màu dựa trên các thuộc tính. Đoạn mã dưới đây được viết trên đỉnh đầu (nhầm lẫn) của tôi, do đó chưa được kiểm tra, nó có thể sai.

Cách thứ nhất là khi bạn đang đẩy các cạnh để bắt đầu xây dựng biểu đồ (Trong trường hợp của tôi đẩy xảy ra bằng cách lấy đối số JSON có chứa tất cả các nút và cạnh và bắt đầu phân tích chúng để tạo cá thể sigma của tôi). Điều này đi bằng cách tạo ra một chức năng mà có trong một điều kiện mà bạn muốn sử dụng để xác định xem đó là một dòng hoặc rải rác.

function determinetype(determinator){ 
    if (determinator === "parent"){return "dotted"} 
    else if (determinator === "grandparent"){return "line"} 
}; 

for (var i = 0; i<graph.edges.length; i++){ 
    var edgetype = determinetype(graph.edges[i]["conditional_markup"]); 
    g.edges.push({ 
    id:graph.edges[i]["id], 
    source: graph.edges[i]["source"], 
    target: graph.edges[i]["target"], 
    type: edgetype, 
    }) 
} 

Cách thứ hai là lặp qua tất cả các cạnh của bạn sau khi được vẽ. Bạn lại muốn tạo một hàm nhận một đối số (bộ xác định) và trả về kiểu đường mà bạn muốn.

function get_type(determinator){ 
    if (determinator === "parent"){return "dotted"} 
    else if (determinator === "grandparent"){return "line"} 
}; 
    s.graph.edges().forEach(function(edge){ 
    edge.type = get_type(edge.conditional_markup); 
    }); 

Tôi hy vọng điều này sẽ hữu ích.