Q:

raphael js drawing multiple lines requested by user

I am using raphael js in the following way to create multiple circles or rectangles according to an user input:
var xx =parseFloat(document.getElementById("Fem").value);
for(var i = 0; i < xx; i+=1) { 

paper.circle(10 + (20*i) , 20  , 5).attr("fill","#FF2");
    } 
var xy =parseFloat(document.getElementById("Male").value);
for(var i = 0; i < xy; i+=1) { 
paper.rect(35 + (20*i), 15 ,10 , 10 ).attr("fill","#FF2");
//paper.path("M 15 +(20*i) , 420 ,l  0 , -40 z"); 
        }

This does the job more or less as I want to, but I would like to have a vertical line from the top of each shape when the iteration is run. paper.path does not work. Would someone please help. I am using this for the first time

A:

I'm not sure entirely what you're trying to achieve, but you must make your arithmetic operations outside of the quotes...
paper.path("M " + (15 + (20*i)) + ", 15 L  0 , -40 z"); 

This shows the lines, you can then play around to get them where you want.

