--- a/src/main/resources/templates/index.html Tue Aug 23 17:12:02 2011 -0400
+++ b/src/main/resources/templates/index.html Tue Aug 23 17:40:45 2011 -0400
@@ -104,17 +104,45 @@
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);
+ //Draw Axis
+ var xAxisLine = document.createElementNS(SN,'line');
+ xAxisLine.setAttribute('x1','20');
+ xAxisLine.setAttribute('x2','20');
+ xAxisLine.setAttribute('y1','20');
+ xAxisLine.setAttribute('y2','180');
+ xAxisLine.setAttribute('stroke','black');
+ xAxisLine.setAttribute('stroke-width','1');
+ svg.appendChild(xAxisLine);
+
+
+ var yAxisLine = document.createElementNS(SN,'line');
+ yAxisLine.setAttribute('x1','20');
+ yAxisLine.setAttribute('x2','440');
+ yAxisLine.setAttribute('y1','180');
+ yAxisLine.setAttribute('y2','180');
+ yAxisLine.setAttribute('stroke','black');
+ yAxisLine.setAttribute('stroke-width','1');
+ svg.appendChild(yAxisLine);
+
+ //Axis Text
+ var xAxisText = document.createElementNS(SN,'text');
+ xAxisText.setAttribute('x','20');
+ xAxisText.setAttribute('y','10');
+ xAxisText.setAttribute("text-anchor","middle");
+ var xAxisTextNode = document.createTextNode("km/h");
+ xAxisText.appendChild(xAxisTextNode);
+ svg.appendChild(xAxisText);
+
+
+ var yAxisText = document.createElementNS(SN,'text');
+ yAxisText.setAttribute('x','450');
+ yAxisText.setAttribute('y','180');
+ yAxisText.setAttribute("alignment-baseline","central");
+ var yAxisTextNode = document.createTextNode("Time");
+ yAxisText.appendChild(yAxisTextNode);
+ svg.appendChild(yAxisText);
var speed_graph = document.getElementById("speed_graph");
- console.log(speed_graph);
speed_graph.appendChild(svg);
}