123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105 |
- <!--[if IE]>
- <meta http-equiv="X-UA-Compatible" content="IE=5,IE=9"><![endif]-->
- <!DOCTYPE html>
- <html>
- <head>
- <title>Grapheditor viewer</title>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
- <style>
- #graph {
- position: absolute;
- cursor: move;
- left: 0;
- right: 0;
- top: 0;
- bottom: 0
- }
- </style>
- <script type="text/javascript">
- var STENCIL_PATH = 'stencils';
- var IMAGE_PATH = 'images';
- var STYLE_PATH = 'styles';
- var urlParams = (function (url) {
- var result = {};
- var idx = url.lastIndexOf('?');
- if (idx > 0) {
- var params = url.substring(idx + 1).split('&');
- for (var i = 0; i < params.length; i++) {
- idx = params[i].indexOf('=');
- if (idx > 0) {
- result[params[i].substring(0, idx)] = params[i].substring(idx + 1);
- }
- }
- }
- return result;
- })(window.location.href);
- var mxLoadResources = false;
- var mxBasePath = './src';
- </script>
- <script type="text/javascript" src="sanitizer/sanitizer.min.js"></script>
- <script type="text/javascript" src="js/mxClient.js"></script>
- <script type="text/javascript" src="js/Graph.js"></script>
- <script type="text/javascript" src="js/Shapes.js"></script>
- </head>
- <body class="geEditor">
- <div id="graph"></div>
- <script type="text/javascript">
- (function (win) {
- var graph = new Graph(document.getElementById('graph'));
- graph.setTooltips(false);
- graph.setEnabled(false);
- graph.setPanning(true);
- var style = graph.getStylesheet().getDefaultVertexStyle();
- style[mxConstants.STYLE_FONTCOLOR] = "#000000";
- style[mxConstants.STYLE_STROKECOLOR] = "#777777";
- style[mxConstants.STYLE_FILLCOLOR] = "#ffffff";
- (style = graph.getStylesheet().getDefaultEdgeStyle())[mxConstants.STYLE_STROKECOLOR] = "#777777";
- style[mxConstants.STYLE_FILLCOLOR] = "#ffffff";
- graph.panningHandler.useLeftButtonForPanning = true;
- graph.panningHandler.ignoreCell = true;
- graph.container.style.cursor = "move";
- graph.resizeContainer = false;
- graph.centerZoom = true;
- graph.border = 0;
- win.addEventListener("message", function (event) {
- var data = event.data;
- switch (data.act) {
- case 'setXml':
- try {
- var xmlDoc = mxUtils.parseXml(data.params.xml);
- var codec = new mxCodec(xmlDoc);
- codec.decode(xmlDoc.documentElement, graph.getModel());
- typeof data.params.scale === "number" && graph.zoomTo(data.params.scale);
- // typeof data.params.scrollTop === "number" && (graph.container.scrollTop = data.params.scrollTop);
- // typeof data.params.scrollLeft === "number" && (graph.container.scrollLeft = data.params.scrollLeft);
- } catch (e) {
- }
- break;
- case 'zoom':
- try {
- graph.zoomTo(data.params.zoom);
- } catch (e) {
- }
- break;
- }
- });
- win.parent.postMessage({
- act: 'ready',
- params: {}
- }, '*');
- })(window);
- </script>
- </body>
- </html>
|