~ Adding svg area ui
authorhiro
Tue, 23 Aug 2011 17:09:48 -0400
branchui
changeset 35 92a748aad407
parent 30 067575f6c9d2
child 36 757f570ed609
~ Adding svg area
src/main/resources/templates/index.html
--- a/src/main/resources/templates/index.html	Tue Aug 23 16:45:37 2011 -0400
+++ b/src/main/resources/templates/index.html	Tue Aug 23 17:09:48 2011 -0400
@@ -59,7 +59,7 @@
 				}
 			};
 			http.send(null);
-			
+			initGraphs();	
 			centerMapOnTrail(jsonData);
 		}
 
@@ -96,6 +96,31 @@
 			return bounds;
 			//return {'longRange': [minLong,maxLong], 'latRange': [minLat,maxLat]}
 		}
+
+		function initGraphs() {
+			var SN = "http://www.w3.org/2000/svg";
+			var root = document.getElementById('graph');
+			var svg = document.createElementNS(SN, 'svg');
+			svg.setAttribute('width', '500');
+			svg.setAttribute('height', '200');
+		
+			var xAxisLine = document.createElement(SN,'line');
+			xAxisLine.setAttribute 	
+			var line = document.createElementNS(SN, 'polygon');
+			line.setAttribute('fill', 'none');
+			line.setAttribute('stroke', "gray");
+			line.setAttribute('stroke-width', '1');
+			line.setAttribute('points', "20 20 20 180 480 180 480 20");
+			svg.appendChild(line);
+
+			var speed_graph = document.getElementById("speed_graph");       
+			console.log(speed_graph);
+
+			speed_graph.appendChild(svg);
+		}
+
+
+		
 	</script>
  
 </head>
@@ -142,5 +167,8 @@
 		</ul>
 	</div>
 	<div id="map" style="width:500px; height:300px"></div>
+	<br />
+	<div id="speed_graph" style="width:500px; height: 200px;"></div>
+
 </body>
-</html>
\ No newline at end of file
+</html>