diff --git a/src/graphxq/samples/hedge.svg b/src/graphxq/samples/hedge.svg
new file mode 100644
index 0000000..594eab6
--- /dev/null
+++ b/src/graphxq/samples/hedge.svg
@@ -0,0 +1,42 @@
+<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48.5 60" version="1.1" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
+  <defs>
+    <linearGradient id="grad1" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" style="stop-color:#E3A820;stop-opacity:1"/>
+      <stop offset="100%" style="stop-color:#FFFFFF;stop-opacity:1"/>
+    </linearGradient>
+  </defs>
+  <rect x="0" y="0" width="100%" height="100%" fill="url(#grad1)"/>
+  <g transform="translate(0,-5) scale(10)">
+    <g>
+      <a xlink:href="https://github.com/apb2006/hedgetree">
+        <title>Debug info: x coord= 0</title>
+        <rect x="0.24249999999999972" y="1" width="4.365" height="1" rx="0.4" ry="0.4" style="fill: yellow; stroke: black; stroke-width: 0.1;"/>
+        <text x="2.425" y="1.8" font-size="0.9" text-anchor="middle">github</text>
+      </a>
+    </g>
+    <line x1="2.425" y1="2" x2="0.445" y2="3" style="stroke-width: 0.1; stroke: black;"/>
+    <line x1="2.425" y1="2" x2="2.67" y2="3" style="stroke-width: 0.1; stroke: black;"/>
+    <g>
+      <a>
+        <title>Debug info: x coord= 0</title>
+        <rect x="0.04449999999999998" y="3" width="0.801" height="1" rx="0.4" ry="0.4" style="fill: yellow; stroke: black; stroke-width: 0.1;"/>
+        <text x="0.445" y="3.8" font-size="0.9" text-anchor="middle">a</text>
+      </a>
+    </g>
+    <g>
+      <a>
+        <title>Debug info: x coord= 0.445</title>
+        <rect x="2.2695" y="3" width="0.801" height="1" rx="0.4" ry="0.4" style="fill: yellow; stroke: black; stroke-width: 0.1;"/>
+        <text x="2.67" y="3.8" font-size="0.9" text-anchor="middle">b</text>
+      </a>
+    </g>
+    <line x1="2.67" y1="4" x2="2.67" y2="5" style="stroke-width: 0.1; stroke: black;"/>
+    <g>
+      <a xlink:href="#treexml">
+        <title>Debug info: x coord= 0.445</title>
+        <rect x="1.0679999999999998" y="5" width="3.204" height="1" rx="0.4" ry="0.4" style="fill: yellow; stroke: black; stroke-width: 0.1;"/>
+        <text x="2.67" y="5.8" font-size="0.9" text-anchor="middle">tree</text>
+      </a>
+    </g>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/graphxq/samples/multiple.svg b/src/graphxq/samples/multiple.svg
new file mode 100644
index 0000000..928abf8
--- /dev/null
+++ b/src/graphxq/samples/multiple.svg
@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <svg x="10">
+    <rect x="10" y="10" height="100" width="100"
+          style="stroke:#ff0000; fill: #0000ff"/>
+  </svg>
+  <svg x="200">
+    <rect x="10" y="10" height="100" width="100"
+          style="stroke:#009900; fill: #00cc00"/>
+  </svg>
+</svg>
\ No newline at end of file
diff --git a/src/graphxq/samples/test.html b/src/graphxq/samples/test.html
new file mode 100644
index 0000000..7da5125
--- /dev/null
+++ b/src/graphxq/samples/test.html
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html>
+  <head id="head">
+    <meta charset="utf-8">
+    <title id="title">svg loader</title>
+   	<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script>
+	<script type="text/javascript">
+$(document).ready(function(){
+   $("#load").on("click",getsvg);
+  
+});
+function getsvg(){
+	var f=$("#src").val();
+alert("hi: "+f);
+$.ajax({
+             type:"GET",
+			 url:f,
+            
+			 dataType: "text",
+             success: function(str){
+               // console.log(data)
+			   var oParser = new DOMParser();
+               var data = oParser.parseFromString(str, "text/xml");
+                // http://stackoverflow.com/questions/3346106/accessing-a-dom-object-defined-in-an-external-svg-file
+                var n = document.importNode(data.documentElement,true);              
+        //        $("#svgdiv").empty().append(n);
+                $("#cuthere").empty().append(n);
+			    
+ 
+              }
+            });
+};
+</script>
+  </head>
+  <body>
+    <div>
+     <input id="src" value="hedge.svg"/>
+     <button id="load">load</button> 
+	 </div>
+	 <svg xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink" onload="init(evt)"  onmousemove="show_coords(evt)"
+  style="border:5px solid red;overflow:scroll;"
+  viewBox="0 0 400 400" version="1.1" width="500px" height="300px" preserveAspectRatio="xMidYMid meet">
+     <script type="text/ecmascript" xlink:href="../viewbox/ViewBox.js"/>
+	  <script type="text/ecmascript"><![CDATA[
+	   var svgns = "http://www.w3.org/2000/svg";
+        var svgRoot;
+       
+        var viewBox;
+        var cursor;
+        var coords; 
+        function init(e) {
+            if ( window.svgDocument == null )
+                svgDocument = e.target.ownerDocument;
+
+            svgRoot =  e.target;
+			 
+           // viewBox  = new ViewBox(svgRoot); 
+			tspans =svgRoot.getElementById("coords").getElementsByTagNameNS(svgns, "tspan");
+        };
+		
+	  function show_coords(e) {
+            var parent = e.currentTarget;
+            var p1     = svgRoot.createSVGPoint();
+			p1.x = e.clientX;
+            p1.y = e.clientY;
+		 
+			// Show the results
+            tspans.item(1).firstChild.data = e.clientX;
+            tspans.item(3).firstChild.data = e.clientY;
+            tspans.item(5).firstChild.data = Math.round(p1.x*100) / 100;
+            tspans.item(7).firstChild.data = Math.round(p1.y*100) / 100;
+			}
+	 ]]></script>
+ <rect x="0" y="0" width="100%" height="100%" fill="yellow"  />	 
+  <g id="cuthere">		
+  
+</g>
+	  <rect x="10" y="10" width="250" height="40" fill="blue" opacity="0.6"/>
+        <text id="coords" fill="white" transform="translate(20,10)"
+              pointer-events="none">
+            <tspan  x="0" dy="10pt">Client X = </tspan><tspan> </tspan>
+            <tspan  x="0" dy="10pt">Client Y = </tspan><tspan> </tspan>
+            <tspan  x="120" dy="-10pt">User X  = </tspan><tspan> </tspan>
+            <tspan x="120" dy="10pt">User Y  = </tspan><tspan> </tspan>
+        </text>
+ 
+</svg>
+   <div id="svgdiv" style="width:400px;height:300px" >hi</div>
+	 </body>
+	 </html>
\ No newline at end of file
diff --git a/src/graphxq/views/dotform.xml b/src/graphxq/views/dotform.xml
index 53d6f1e..cec768d 100644
--- a/src/graphxq/views/dotform.xml
+++ b/src/graphxq/views/dotform.xml
@@ -65,7 +65,9 @@
 
 	</div>
 
-	<script>
-	
+	<script type="text/javascript">
+	$(document).ready(function(){{
+	  getsvg(false)
+	}}
 	</script>
 </div>
\ No newline at end of file
diff --git a/src/graphxq/views/layout.xml b/src/graphxq/views/layout.xml
index e864f92..5f49028 100644
--- a/src/graphxq/views/layout.xml
+++ b/src/graphxq/views/layout.xml
@@ -7,18 +7,18 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<meta name="description" content="xquery documentation" />
 		<meta name="author" content="andy bunce" />
-		<link href="/lib/bootstrap/2.1.0/css/bootstrap.css" rel="stylesheet"
+		<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.css" rel="stylesheet"
 			type="text/css" />
 
 
-		<link href="/lib/bootstrap/2.1.0/css/bootstrap-responsive.min.css"
+		<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap-responsive.min.css"
 			rel="stylesheet" type="text/css" />
 		<link href="/graphxq/app.css" rel="stylesheet" type="text/css" />
 		<!-- Le fav and touch icons -->
 		<link rel="shortcut icon" href="/graphxq/graphxq2.png" />
 
-		<script src="/lib/jquery/jquery-1.7.1.min.js" type="text/javascript"></script>
-		<script src="/lib/bootstrap/2.1.0/js/bootstrap.min.js" type="text/javascript"></script>
+		<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script>
+		<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/bootstrap.min.js" type="text/javascript"></script>
 		<script src="/graphxq/jquery-svgpan.js" type="text/javascript"></script>
         <script src="/graphxq/app.js" type="text/javascript"></script>
         <script type="text/javascript"><![CDATA[
