首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

js画图开发库-mxgraph-[thread-线路图.html]

2013-02-24 
js画图开发库--mxgraph--[thread-线路图.html]?!Doctype htmlhtml xmlnshttp://www.w3.org/1999/xhtml

js画图开发库--mxgraph--[thread-线路图.html]

?

<!Doctype html><html xmlns=http://www.w3.org/1999/xhtml><head><meta http-equiv=Content-Type content="text/html;charset=utf-8"><title>线路图</title><!-- 如果本文件的包与src不是在同一个目录,就要将basepath设置到src目录下 --><script type="text/javascript">mxBasePath = '../src';</script><!-- 引入支持库文件 --><script type="text/javascript" src="../src/js/mxClient.js"></script><!-- 示例代码 --><script type="text/javascript">//  程序在此方法中启动 function main(container){// 检查浏览器支持if (!mxClient.isBrowserSupported()){mxUtils.error('Browser is not supported!', 200, false);}else{// 在容器中创建图形var graph = new mxGraph(container);// 禁用浏览器基础的选择菜单和监听处理程序graph.setEnabled(false);// 创建默认窗体var parent = graph.getDefaultParent();var v1, v2, e1;// 启动事务更新graph.getModel().beginUpdate();try{v1 = graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30);v2 = graph.insertVertex(parent, null, 'World!', 200, 150, 80, 30);e1 = graph.insertEdge(parent, null, '', v1, v2);}finally{// 结束更新事务graph.getModel().endUpdate();}// 功能切换间隔5秒var f = function(){var overlays = graph.getCellOverlays(v1);if (overlays == null){graph.removeCellOverlays(v2);graph.setCellWarning(v1, 'Tooltip');}else{graph.removeCellOverlays(v1);graph.setCellWarning(v2, 'Tooltip');}};window.setInterval(f, 1000);f();}};</script></head><!-- 页面载入时启动程序 --><body onload="main(document.getElementById('graphContainer'))"><!-- 创建带网格壁纸和曲线的一个容器  --><div id="graphContainer"style="overflow:hidden;width:321px;height:241px;background:url('editors/images/grid.gif')"></div></body></html>

?

?

热点排行