Graph.js setOption Example

gistfile1.js

        //draw vertices as green circles
        G.setOption('vertexDrawFunction',
                    //v is a vertex object with x and y attributes. 
                    function(ctx,v,graph) {
                        ctx.beginPath();
                        ctx.fillStyle= '#0f0';
                        ctx.arc(v.x,v.y, 5,0,10,false);
                        ctx.fill();
                        ctx.closePath();
                    });

        //Draw edges as curves instead of straight lines.
        G.setOption('edgeDrawFunction',
                     //e is a edge object with vertex attributes v1 and v2
                     function(ctx,e,graph) {
                         ctx.beginPath();
                         ctx.moveTo(e.v1.x, e.v1.y);

                         //ax,ay gives the midpoint of e.
                         var ax = (e.v1.x + e.v2.x)/2;
                         var ay = (e.v1.y + e.v2.y)/2;
                        
                         ctx.quadraticCurveTo(ax,ay+20, e.v2.x, e.v2.y);
                         ctx.stroke();
                         ctx.closePath();
                     });

       //Set the physics mode. Allowable settings are 'default' or 'float'.
       G.setOption('physics', 'float');