网络拓扑图js插件——jTopo应用

jTopo官网：http://www.jtopo.com/    

1、特点：

基于HTML5 Canvas，不依赖其他库

2、应用：

效果：

源码github地址

在HTML页面中引入jtopo.min.js文件，添加一个canvas：

  
    
    
    
    
    
    
    
         
    
          
    
    
  

  
    
  
      
顺时针旋转
      
逆时针旋转
 
      
放大
      
缩小
        
      
节点详情
 
      
编辑节点
       
      
删除该节点
    
    
        
      
删除该连线
    
    

    

      

        

          
                                                 
            
                                                  
              
                                       
                      
              
              
                                                       
                           
              
              
                                       
                              
              
              
                             
                                       
              
  
              
                                                       
                           
              
              
                                       
                              
              
              
                             
                                       
              
                                       
            
          
          
  
              
                                 
          
        
                
      
               
    
 
    
    
    
  

根据自身需求，控制节点、连线等的样式；

给节点、连线添加右键菜单；

可以通过添加鼠标事件实现拖拽组件绘制拓扑图；

节点、连线、右键菜单、拓扑图的数据可用json格式在前后端传递。