首页 > 其他 > 详细

mxGraph上下级节点与连线高亮显示代码

时间:2020-06-02 18:01:48      阅读:328      评论:0      收藏:0      [点我收藏+]
 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);
                 }
             }
         }
    });

 

mxGraph上下级节点与连线高亮显示代码

原文:https://www.cnblogs.com/symbol8888/p/13031263.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!