mxGraph上下級節點與連線高亮顯示代碼


 var highlightList = [];
    var highlighEdgetList = [];
    // 給圖中節點加入單擊事件
    graph.addListener(mxEvent.CLICK, function(sender, evt)
    {
         var cell = evt.getProperty('cell');
         
         // 高亮節點集合
         if(highlightList){
             for(var k=0;k<highlightList.length;k++){
                 highlightList[k].light.destroy();
             }
         }

        // 高亮線集合
        if(highlighEdgetList){
            for(var k=0;k<highlighEdgetList.length;k++){
                highlighEdgetList[k].light.destroy();
            }
        }
         
        if(cell&&cell.isVertex&&cell.itypeid){
             var edges = cell.edges;
             var edge;
             for(var i=0;i<edges.length;i++){
                 edge = edges[i];
                 // 添加上級節點相關高亮配置
                 if(cell.id!=edge.source.id){
                     var cellSource = graph.getModel().getCell(edge.source.id);
                     // 上級節點高亮配置
                     var highlight = new mxCellHighlight(graph, '#00FF00', 2);
                     highlight.highlight(graph.view.getState(cellSource));
                     var highlightMap = {};

                     highlightMap.cell = cellSource;
                     highlightMap.light = highlight;
                     highlightList.push(highlightMap);

                    // 上級連線高亮配置
                     var highlightEdge = new mxCellHighlight(graph, '#00FF00', 2);
                     highlightEdge.highlight(graph.view.getState(edge));
                     var highlightEdgeMap = {};
                     highlightEdgeMap.light = highlightEdge;
                     highlighEdgetList.push(highlightEdgeMap);
                 }
                 // 添加下級節點相關高亮配置
                 if(cell.id!=edge.target.id){
                     var cellTarget = graph.getModel().getCell(edge.target.id);
                     // 下級節點高亮配置
                     var highlight = new mxCellHighlight(graph, '#00FF00', 2);
                     highlight.highlight(graph.view.getState(cellTarget));

                     var highlightMap = {};
                     highlightMap.cell = cellTarget;
                     highlightMap.light = highlight;
                     highlightList.push(highlightMap);
                    // 下級連線高亮配置
                     var highlightEdge = new mxCellHighlight(graph, '#00FF00', 2);
                     highlightEdge.highlight(graph.view.getState(edge));
                     var highlightEdgeMap = {};
                     highlightEdgeMap.light = highlightEdge;
                     highlighEdgetList.push(highlightEdgeMap);
                 }
             }
         }
    });

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM