Improve Group example code.

src/item/Group.js

@@ -19,36 +19,47 @@ var Group = this.Group = Item.extend({
 
 	beans: true,
 
+	// DOCS: document new Group(item, item...);
 	/**
 	 * Creates a new Group item and places it at the top of the active layer.
 	 * 
 	 * @param {Array} [children] An optional array of children that will be
 	 * added to the newly created group.
 	 * 
-	 * @example
+	 * @example {@paperscript split=true height=200}
-	 * // Create an empty group and append a path to the top of its children
+	 * // Create a group containing two paths:
-	 * // array:
+	 * var path = new Path(new Point(100, 100), new Point(100, 200));
+	 * var path2 = new Path(new Point(50, 150), new Point(150, 150));
 	 * 
-	 * // Create an empty group:
+	 * // Create a group from the two paths:
-	 * var group = new Group();
+	 * var group = new Group([path, path2]);
-	 * 
-	 * var path = new Path([new Point(10, 10), new Point(50, 50)]);
-	 * path.strokeColor = 'black';
-	 * 
-	 * // Append the path to the group:
-	 * group.appendTop(path);
 	 * 
 	 * // Set the stroke color of all items in the group:
-	 * circleGroup.strokeColor = 'black';
+	 * group.strokeColor = 'black';
 	 * 
-	 * @example
+	 * // Move the group to the center of the view:
-	 * // Create a group containing two paths:
+	 * group.position = view.center;
-	 * var circle = new Path.Circle(new Point(30, 50), 10);
-	 * var circle2 = new Path.Circle(new Point(50, 50), 10);
 	 * 
-	 * var circleGroup = new Group([circle, circle2]);
+	 * @example {@paperscript split=true}
-	 * // Set the fill color of all items in the group:
+	 * // Click in the view to add a path to the group, which in turn is rotated
-	 * circleGroup.fillColor = 'black';
+	 * // every frame:
+	 * var group = new Group();
+	 * 
+	 * function onMouseDown(event) {
+	 * 	// Create a new circle shaped path at the position
+	 * 	// of the mouse:
+	 * 	var path = new Path.Circle(event.point, 5);
+	 * 	path.fillColor = 'black';
+	 * 
+	 * 	// Move the path to the top of the group's children list:
+	 * 	group.appendTop(path);
+	 * }
+	 * 
+	 * function onFrame(event) {
+	 * 	// Rotate the group by 1 degree from
+	 * 	// the centerpoint of the view:
+	 * 	group.rotate(1, view.center);
+	 * }
 	 * 
 	 * @class A Group is a collection of items. When you transform a Group, its
 	 * children are treated as a single unit without changing their relative