// Simple dashed pattern on circle with mask
+// Lets connect mask and circle together. Also useful if we have a path
+// and can’t calculate offset easily.
+var s = Snap("#svg");
+// So, lets start with an empty circle.
+// It’s important that it will not have any attributes set
+var bigCircle = s.circle(150, 150, 100);
+
//-----------------------------------------------------
+// Lets use it again for patterned fill
+var c1 = bigCircle.use();
+// Create pattern
+var p = s.path("M110,95,95,110M115,100,100,115").attr({
+ fill: "none",
+ stroke: "#bada55",
+ strokeWidth: 4
+ });
+var ptrn = p.pattern(100, 100, 10, 10);
+// and apply some nice attributes
+c1.attr({
+ fill: ptrn
+});
+
//-----------------------------------------------------
+// Lets use it for stroke
+var c2 = bigCircle.use();
+c2.attr({
+ fill: "none",
+ stroke: "#000",
+ strokeWidth: 6
+});
+
// Lets create a masking circle
+
var ring = bigCircle.use();
+ring.attr({
+ fill: "none",
+ stroke: "#000",
+ strokeWidth: 20 // we need only inner 10px of it
+});
+
// Hide bigCircle by moving it to <defs>
+bigCircle.toDefs();