Графики(svg)

[onehp]

Привет, ребят. Пытаюсь с помощью библиотеки Рафаэль нарисовать графики, по заданным точкам, точки, как видно берутся из input. Первые попытки, не ругайтесь сильно . Так вот, что я делаю не так, скажите пожалуйста, пишу данные в тот же input, данные приходят, делаю "проверку" alert(cX.value), мб я ошибаюсь и это ничего не значит, но данные все же приходят, теперь не могу нарисовать точку, какой там график , прошу помощи и подсказок

window.onload = function() {

		var w = screen.width;
		var h = screen.height;
		var w2 = (w/2);
		var h2 = (h/2);

		var cX = document.getElementById("cX");
		var cY = document.getElementById("cY");

		function checkForm(){
			
			if (!cX.value){
				alert('111');
				cX.focus();
				return false;
			}
			if (!cY.value){
				alert('111');
				cY.focus();
				return false;
			}
			alert(cX.value);

		
		}
		
		var ph = document.getElementById("placeholder");
		var paper = Raphael(ph, w, h);
		
		//document.write("width " + w + "<br>");
		//document.write("height " + h);
		
		var c1 = paper.path("M"+w2+","+h2+" "+w2+",0");
		var c2 = paper.path("M"+w2+","+h2+" "+w2+","+w);
		var c3 = paper.path("M"+w2+","+h2+" "+"0,"+h2);
		var c4 = paper.path("M"+w2+","+h2+" "+(h*h)+","+h2);

		/*var t1 = paper.circle(w2+10, h2, 3);
		t1.attr("fill", "black");

		var t2 = paper.circle(w2+20, h2, 3);
		t2.attr("fill", "black");*/

		var t3 = paper.circle((w2+((cX.value)*10)), ((h2+(cY.value)*10)), 3);
		t3.attr("fill", "black");

		var myForm = document.getElementById('myForm');
		myForm.onsubmit = checkForm;
	}

<div id="placeholder">
    	<form id = "myForm">
	    	x = <input type = "text" name = "cX" id = "cX">
	    	y = <input type = "text" name = "cY" id = "cY">
	    	<input type = "submit" value = "go">
    	</form>
    </div>

Получается такое: