Set you pattern. This will be used to validate all other 3*3 pattern in following examples.

Minimum initialization.

    var lock= new PatternLock('#patternHolder');
    

Draw line between two points only when we reach second point.

    var lock= new PatternLock('#patternHolder',{lineOnMove:false})
    

Keep pattern hidden while drawing.

    var lock= new PatternLock('#patternHolder',{patternVisible:false});
    

Allow repeating over dots

Note : Allowing repeation over dots gives a more complex pattern but have different side effects, like arrow css will not be correct, forming a multiple loop and confusing patterns.

        var lock= new PatternLock('#patternHolder',{allowRepeat : true});
        

Updating size and spacing between circles

    var lock= new PatternLock('#patternHolder',{radius:30,margin:20});
    

Create different matrix pattern

    var lock= new PatternLock('#patternHolder',{matrix:[4,4]});
    

Using mapper

    var lock=new PatternLock('#patternHolder',{
      mapper: function(idx){
        return (idx%9) + 1;
        }
    });
    

Using as a captcha(Require patternCaptha on node server)
Match the pattern in right side.