html5实现的网络拓扑图

【实例简介】
是一个基于HTML5技术实现的网络拓扑图，可以实现数据序列化与反序列化，拖拽。 涉及到的类库： kinetic-js jquery-easyui jquery
【实例截图】
【核心代码】
nettopology.zip
└── nettopology
├── css
│   └── demo.css
├── demo
│   ├── layout.html
│   ├── layout.html.bak
│   └── Pie.html
├── images
│   ├── background.png
│   ├── Bridge_128x128.png
│   ├── Certificate_128x128.png
│   ├── Certificate_Off_128x128.png
│   ├── Cloud_128x128.png
│   ├── Cloud_Computer_128x128.png
│   ├── Cloud_Computer_Private_128x128.png
│   ├── Cloud_Rack_128x128.png
│   ├── Cloud_Rack_Private_128x128.png
│   ├── Cloud_Server_128x128.png
│   ├── Cloud_Server_Private_128x128.png
│   ├── Cloud_Storage_128x128.png
│   ├── Concentrator_128x128.png
│   ├── connector.png
│   ├── Email_128x128.png
│   ├── Firewall_02_128x128.png
│   ├── Firewall_128x128.png
│   ├── Firewall-page1_128x128.png
│   ├── Gear_128x128.png
│   ├── Ip_Camera_128x128.png
│   ├── Modem_128x128.png
│   ├── power_distribution_unit_128x128.png
│   ├── Print_Server_128x128.png
│   ├── Print_Server_Wireless_128x128.png
│   ├── Repeater_128x128.png
│   ├── Router_128x128.png
│   ├── Router_Icon_128x128.png
│   ├── Switch_128x128.png
│   ├── UPS_128x128.png
│   ├── Wireless_Router_128x128.png
│   └── Wireless_Router_N_128x128.png
├── js
│   ├── jquery-1.7.2.min.js
│   ├── jquery.easyui.min.js
│   ├── json2.js
│   ├── kinetic_pie.js
│   ├── kinetic_topology.js
│   ├── kinetic_topology.js.bak
│   ├── kinetic-v3.10.4.js
│   └── uuid.js
├── locale
│   ├── easyui-lang-af.js
│   ├── easyui-lang-bg.js
│   ├── easyui-lang-ca.js
│   ├── easyui-lang-cs.js
│   ├── easyui-lang-cz.js
│   ├── easyui-lang-da.js
│   ├── easyui-lang-de.js
│   ├── easyui-lang-en.js
│   ├── easyui-lang-es.js
│   ├── easyui-lang-fr.js
│   ├── easyui-lang-nl.js
│   ├── easyui-lang-tr.js
│   ├── easyui-lang-zh_CN.js
│   └── easyui-lang-zh_TW.js
├── readme.txt
└── themes
├── default
│   ├── accordion.css
│   ├── calendar.css
│   ├── combobox.css
│   ├── combo.css
│   ├── datagrid.css
│   ├── datebox.css
│   ├── dialog.css
│   ├── easyui.css
│   ├── images
│   │   ├── accordion_collapse.png
│   │   ├── accordion_expand.png
│   │   ├── blank.gif
│   │   ├── button_a_bg.gif
│   │   ├── button_plain_hover.png
│   │   ├── button_span_bg.gif
│   │   ├── calendar_nextmonth.gif
│   │   ├── calendar_nextyear.gif
│   │   ├── calendar_prevmonth.gif
│   │   ├── calendar_prevyear.gif
│   │   ├── combo_arrow.gif
│   │   ├── datagrid_header_bg.gif
│   │   ├── datagrid_row_collapse.gif
│   │   ├── datagrid_row_expand.gif
│   │   ├── datagrid_sort_asc.gif
│   │   ├── datagrid_sort_desc.gif
│   │   ├── datagrid_title_bg.png
│   │   ├── datebox_arrow.png
│   │   ├── layout_button_down.gif
│   │   ├── layout_button_left.gif
│   │   ├── layout_button_right.gif
│   │   ├── layout_button_up.gif
│   │   ├── menu_downarrow.png
│   │   ├── menu.gif
│   │   ├── menu_rightarrow.png
│   │   ├── menu_sep.png
│   │   ├── menu_split_downarrow.png
│   │   ├── messager_error.gif
│   │   ├── messager_info.gif
│   │   ├── messager_question.gif
│   │   ├── messager_warning.gif
│   │   ├── pagination_first.gif
│   │   ├── pagination_last.gif
│   │   ├── pagination_loading.gif
│   │   ├── pagination_load.png
│   │   ├── pagination_next.gif
│   │   ├── pagination_prev.gif
│   │   ├── panel_loading.gif
│   │   ├── panel_title.png
│   │   ├── panel_tool_collapse.gif
│   │   ├── panel_tool_expand.gif
│   │   ├── panel_tools.gif
│   │   ├── searchbox_button.png
│   │   ├── slider_handle.png
│   │   ├── spinner_arrow_down.gif
│   │   ├── spinner_arrow_up.gif
│   │   ├── tabs_active.png
│   │   ├── tabs_close.gif
│   │   ├── tabs_enabled.png
│   │   ├── tabs_leftarrow.png
│   │   ├── tabs_rightarrow.png
│   │   ├── Thumbs.db
│   │   ├── tree_arrows.gif
│   │   ├── tree_checkbox_0.gif
│   │   ├── tree_checkbox_1.gif
│   │   ├── tree_checkbox_2.gif
│   │   ├── tree_dnd_no.png
│   │   ├── tree_dnd_yes.png
│   │   ├── tree_elbow.png
│   │   ├── tree_file.gif
│   │   ├── tree_folder.gif
│   │   ├── tree_folder_open.gif
│   │   ├── tree_loading.gif
│   │   ├── validatebox_pointer.gif
│   │   └── validatebox_warning.png
│   ├── layout.css
│   ├── linkbutton.css
│   ├── menubutton.css
│   ├── menu.css
│   ├── messager.css
│   ├── pagination.css
│   ├── panel.css
│   ├── progressbar.css
│   ├── propertygrid.css
│   ├── searchbox.css
│   ├── slider.css
│   ├── spinner.css
│   ├── splitbutton.css
│   ├── tabs.css
│   ├── tree.css
│   ├── validatebox.css
│   └── window.css
├── gray
│   ├── accordion.css
│   ├── calendar.css
│   ├── combobox.css
│   ├── combo.css
│   ├── datagrid.css
│   ├── datebox.css
│   ├── dialog.css
│   ├── easyui.css
│   ├── images
│   │   ├── accordion_collapse.png
│   │   ├── accordion_expand.png
│   │   ├── blank.gif
│   │   ├── button_a_bg.gif
│   │   ├── button_plain_hover.png
│   │   ├── button_span_bg.gif
│   │   ├── calendar_nextmonth.gif
│   │   ├── calendar_nextyear.gif
│   │   ├── calendar_prevmonth.gif
│   │   ├── calendar_prevyear.gif
│   │   ├── combo_arrow.gif
│   │   ├── datagrid_header_bg.gif
│   │   ├── datagrid_row_collapse.gif
│   │   ├── datagrid_row_expand.gif
│   │   ├── datagrid_sort_asc.gif
│   │   ├── datagrid_sort_desc.gif
│   │   ├── datagrid_title_bg.gif
│   │   ├── datebox_arrow.png
│   │   ├── layout_button_down.gif
│   │   ├── layout_button_left.gif
│   │   ├── layout_button_right.gif
│   │   ├── layout_button_up.gif
│   │   ├── menu_downarrow.png
│   │   ├── menu.gif
│   │   ├── menu_rightarrow.png
│   │   ├── menu_sep.png
│   │   ├── menu_split_downarrow.png
│   │   ├── messager_error.gif
│   │   ├── messager_info.gif
│   │   ├── messager_question.gif
│   │   ├── messager_warning.gif
│   │   ├── pagination_first.gif
│   │   ├── pagination_last.gif
│   │   ├── pagination_loading.gif
│   │   ├── pagination_load.png
│   │   ├── pagination_next.gif
│   │   ├── pagination_prev.gif
│   │   ├── panel_loading.gif
│   │   ├── panel_title.gif
│   │   ├── panel_tool_collapse.gif
│   │   ├── panel_tool_expand.gif
│   │   ├── panel_tools.gif
│   │   ├── searchbox_button.png
│   │   ├── slider_handle.png
│   │   ├── spinner_arrow_down.gif
│   │   ├── spinner_arrow_up.gif
│   │   ├── tabs_close.gif
│   │   ├── tabs_enabled.gif
│   │   ├── tabs_leftarrow.png
│   │   ├── tabs_rightarrow.png
│   │   ├── Thumbs.db
│   │   ├── tree_arrows.gif
│   │   ├── tree_checkbox_0.gif
│   │   ├── tree_checkbox_1.gif
│   │   ├── tree_checkbox_2.gif
│   │   ├── tree_dnd_no.png
│   │   ├── tree_dnd_yes.png
│   │   ├── tree_elbow.png
│   │   ├── tree_file.gif
│   │   ├── tree_folder.gif
│   │   ├── tree_folder_open.gif
│   │   ├── tree_loading.gif
│   │   ├── validatebox_pointer.gif
│   │   └── validatebox_warning.png
│   ├── layout.css
│   ├── linkbutton.css
│   ├── menubutton.css
│   ├── menu.css
│   ├── messager.css
│   ├── pagination.css
│   ├── panel.css
│   ├── progressbar.css
│   ├── propertygrid.css
│   ├── searchbox.css
│   ├── slider.css
│   ├── spinner.css
│   ├── splitbutton.css
│   ├── tabs.css
│   ├── tree.css
│   ├── validatebox.css
│   └── window.css
├── icon.css
└── icons
├── back.png
├── blank.gif
├── cancel.png
├── cut.png
├── edit_add.png
├── edit_remove.png
├── filesave.png
├── help.png
├── mini_add.png
├── mini_edit.png
├── mini_refresh.png
├── no.png
├── ok.png
├── pencil.png
├── print.png
├── redo.png
├── reload.png
├── search.png
├── sum.png
├── tip.png
└── undo.png

12 directories, 259 files