2017-11-16 12 views
5

मैं और एक sigma.js ग्राफ बिंदीदार में किनारों आकर्षित करने के लिए कोशिश कर रहा हूँ घुमावदार को दो अलग-अलग प्रकार लागू करने के लिए कैसे। मैं customEdgeShapes और curve प्लगइन का उपयोग कर रहा हूं लेकिन मैं एक ही किनारे में दो अलग-अलग शैलियों को गठबंधन नहीं कर सकता। वास्तव में मैं केवल type विशेषता के लिए एक एकल शैली लागू कर सकते हैं:sigma.js में बढ़त

edge.type = 'curvedArrow'; 

या

edge.type = 'dotted'; 

मैं कैसे किसी किनारे पर दोनों शैलियों आवेदन कर सकते हैं?

उत्तर

0

मैं अब एक या दो सप्ताह के लिए सिग्मा.जेएस का उपयोग कर रहा हूं और सोचता हूं कि आप जो चाहते हैं उसे करने के कुछ तरीके हैं। मैंने गुणों के आधार पर नोड-रंगों को अलग करने के लिए इस विधि का उपयोग किया है। नीचे दिया गया कोड मेरे (भ्रमित) सिर के शीर्ष पर लिखा गया है, इस प्रकार अनचाहे, यह गलत हो सकता है।

सबसे पहले जिस तरह से जब आप किनारों बढ़ा रहे हैं ग्राफ का निर्माण शुरू करने (मेरे मामले को आगे बढ़ाने में JSON तर्क है कि सभी नोड्स और किनारों होता है और उन्हें पार्स करने मेरी सिग्मा उदाहरण बनाने के लिए शुरू लेने के द्वारा होता है) है। यह एक ऐसा फ़ंक्शन बनाकर चला जाता है जो एक सशर्त में ले जाता है जिसे आप यह निर्धारित करने के लिए उपयोग करेंगे कि यह एक रेखा या बिंदीदार है या नहीं।

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, 
    }) 
} 

दूसरा तरीका खींचा जाने के बाद आपके सभी किनारों पर फिर से शुरू करना होगा। आप फिर से एक ऐसा फ़ंक्शन बनाना चाहते हैं जो एक तर्क (निर्धारक) लेता है और जिस लाइन शैली को आप चाहते हैं उसे वापस कर दें।

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); 
    }); 

मुझे उम्मीद है कि इससे मदद मिलती है।

+0

आपके उत्तर के लिए धन्यवाद, लेकिन मैं एक किनारा बनाना चाहता हूं जो घुमावदार और बिंदीदार दोनों है। प्लगइन को फिर से लिखना एकमात्र तरीका है ... – rikpg

संबंधित मुद्दे