Edit in JSFiddle

window.onload = function () {
    
    //create paper
    var paper = Raphael("canvas");
    
    //純白の線
    path = paper.path("M0,0 C0,100 100,0 150,100");
    path.attr({
        "stroke":"#FFF",
        "stroke-width":"10",
        "stroke-dasharray":""
    });
    
    //漆黒の線
    path = paper.path("M100,0 C100,100 200,0 250,100");
    path.attr({
        "stroke":"#000",
        "stroke-width":"10",
        "stroke-dasharray":"-"
    });
    
    //紅の線
    path = paper.path("M200,0 C200,100 300,0 350,100");
    path.attr({
        "stroke":"#C10",
        "stroke-width":"10",
        "stroke-dasharray":"."
    });
    
    //群青の線
    path = paper.path("M0,100 C0,200 100,100 150,200");
    path.attr({
        "stroke":"#00F",
        "stroke-width":"10",
        "stroke-dasharray":"-."
    });
    
    //紺碧の線
    path = paper.path("M100,100 C100,200 200,100 250,200");
    path.attr({
        "stroke":"#0F0",
        "stroke-width":"10",
        "stroke-dasharray":"--"
    });
    
    //紫の線
    path = paper.path("M200,100 C200,200 300,100 350,200");
    path.attr({
        "stroke":"#908",
        "stroke-width":"10",
        "stroke-dasharray":"--.."
    });
    
    
}
<div id="canvas"></div>
body,html
{
    height:100%;
    margin:0;
}

#canvas 
{
    height:100%;
    background:#aaa;
}