paper 0.12.18 → 0.12.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (231) hide show
  1. package/CHANGELOG.md +49 -0
  2. package/README.md +5 -14
  3. package/dist/docs/assets/js/paper.js +94 -54
  4. package/dist/docs/classes/Color.html +2 -2
  5. package/dist/docs/classes/CompoundPath.html +2 -2
  6. package/dist/docs/classes/Curve.html +2 -2
  7. package/dist/docs/classes/CurveLocation.html +2 -2
  8. package/dist/docs/classes/Event.html +2 -2
  9. package/dist/docs/classes/Gradient.html +2 -2
  10. package/dist/docs/classes/GradientStop.html +2 -2
  11. package/dist/docs/classes/Group.html +2 -2
  12. package/dist/docs/classes/HitResult.html +2 -2
  13. package/dist/docs/classes/Item.html +2 -2
  14. package/dist/docs/classes/Key.html +2 -2
  15. package/dist/docs/classes/KeyEvent.html +2 -2
  16. package/dist/docs/classes/Layer.html +2 -2
  17. package/dist/docs/classes/Matrix.html +2 -2
  18. package/dist/docs/classes/MouseEvent.html +2 -2
  19. package/dist/docs/classes/PaperScope.html +2 -2
  20. package/dist/docs/classes/PaperScript.html +2 -2
  21. package/dist/docs/classes/Path.html +2 -2
  22. package/dist/docs/classes/PathItem.html +2 -2
  23. package/dist/docs/classes/Point.html +2 -2
  24. package/dist/docs/classes/PointText.html +2 -2
  25. package/dist/docs/classes/Project.html +2 -2
  26. package/dist/docs/classes/Raster.html +2 -2
  27. package/dist/docs/classes/Rectangle.html +2 -2
  28. package/dist/docs/classes/Segment.html +2 -2
  29. package/dist/docs/classes/Shape.html +2 -2
  30. package/dist/docs/classes/Size.html +2 -2
  31. package/dist/docs/classes/Style.html +2 -2
  32. package/dist/docs/classes/SymbolDefinition.html +2 -2
  33. package/dist/docs/classes/SymbolItem.html +2 -2
  34. package/dist/docs/classes/TextItem.html +2 -2
  35. package/dist/docs/classes/Tool.html +2 -2
  36. package/dist/docs/classes/ToolEvent.html +2 -2
  37. package/dist/docs/classes/Tween.html +2 -2
  38. package/dist/docs/classes/View.html +2 -2
  39. package/dist/docs/classes/global.html +2 -2
  40. package/dist/docs/classes/index.html +2 -2
  41. package/dist/docs/index.html +1 -1
  42. package/dist/node/canvas.js +9 -7
  43. package/dist/node/self.js +9 -1
  44. package/dist/paper-core.js +93 -53
  45. package/dist/paper-core.min.js +3 -3
  46. package/dist/paper-full.js +94 -54
  47. package/dist/paper-full.min.js +3 -3
  48. package/dist/paper.d.ts +2 -2
  49. package/package.json +11 -7
  50. package/dist/paperjs/LICENSE.txt +0 -23
  51. package/dist/paperjs/dist/node/canvas.js +0 -66
  52. package/dist/paperjs/dist/node/extend.js +0 -156
  53. package/dist/paperjs/dist/node/self.js +0 -58
  54. package/dist/paperjs/dist/node/xml.js +0 -40
  55. package/dist/paperjs/dist/paper-core.d.ts +0 -1
  56. package/dist/paperjs/dist/paper-core.js +0 -15703
  57. package/dist/paperjs/dist/paper-core.min.js +0 -32
  58. package/dist/paperjs/dist/paper-full.js +0 -17472
  59. package/dist/paperjs/dist/paper-full.min.js +0 -32
  60. package/dist/paperjs/dist/paper.d.ts +0 -7394
  61. package/dist/paperjs/docs/assets/css/docs.css +0 -414
  62. package/dist/paperjs/docs/assets/js/codemirror.js +0 -4
  63. package/dist/paperjs/docs/assets/js/docs.js +0 -493
  64. package/dist/paperjs/docs/assets/js/jquery.js +0 -6
  65. package/dist/paperjs/docs/assets/js/paper.js +0 -17472
  66. package/dist/paperjs/docs/classes/Color.html +0 -2188
  67. package/dist/paperjs/docs/classes/CompoundPath.html +0 -8877
  68. package/dist/paperjs/docs/classes/Curve.html +0 -2323
  69. package/dist/paperjs/docs/classes/CurveLocation.html +0 -672
  70. package/dist/paperjs/docs/classes/Event.html +0 -176
  71. package/dist/paperjs/docs/classes/Gradient.html +0 -240
  72. package/dist/paperjs/docs/classes/GradientStop.html +0 -273
  73. package/dist/paperjs/docs/classes/Group.html +0 -6864
  74. package/dist/paperjs/docs/classes/HitResult.html +0 -239
  75. package/dist/paperjs/docs/classes/Item.html +0 -6628
  76. package/dist/paperjs/docs/classes/Key.html +0 -139
  77. package/dist/paperjs/docs/classes/KeyEvent.html +0 -308
  78. package/dist/paperjs/docs/classes/Layer.html +0 -6850
  79. package/dist/paperjs/docs/classes/Matrix.html +0 -1744
  80. package/dist/paperjs/docs/classes/MouseEvent.html +0 -355
  81. package/dist/paperjs/docs/classes/PaperScope.html +0 -459
  82. package/dist/paperjs/docs/classes/PaperScript.html +0 -198
  83. package/dist/paperjs/docs/classes/Path.html +0 -11775
  84. package/dist/paperjs/docs/classes/PathItem.html +0 -8639
  85. package/dist/paperjs/docs/classes/Point.html +0 -2699
  86. package/dist/paperjs/docs/classes/PointText.html +0 -7029
  87. package/dist/paperjs/docs/classes/Project.html +0 -1305
  88. package/dist/paperjs/docs/classes/Raster.html +0 -7843
  89. package/dist/paperjs/docs/classes/Rectangle.html +0 -1654
  90. package/dist/paperjs/docs/classes/Segment.html +0 -939
  91. package/dist/paperjs/docs/classes/Shape.html +0 -7363
  92. package/dist/paperjs/docs/classes/Size.html +0 -1825
  93. package/dist/paperjs/docs/classes/Style.html +0 -919
  94. package/dist/paperjs/docs/classes/SymbolDefinition.html +0 -311
  95. package/dist/paperjs/docs/classes/SymbolItem.html +0 -6755
  96. package/dist/paperjs/docs/classes/TextItem.html +0 -6869
  97. package/dist/paperjs/docs/classes/Tool.html +0 -761
  98. package/dist/paperjs/docs/classes/ToolEvent.html +0 -446
  99. package/dist/paperjs/docs/classes/Tween.html +0 -374
  100. package/dist/paperjs/docs/classes/View.html +0 -1772
  101. package/dist/paperjs/docs/classes/global.html +0 -425
  102. package/dist/paperjs/docs/classes/index.html +0 -88
  103. package/dist/paperjs/docs/index.html +0 -11
  104. package/dist/paperjs/examples/Animated/AnimatedStar.html +0 -53
  105. package/dist/paperjs/examples/Animated/BooleanOperations.html +0 -115
  106. package/dist/paperjs/examples/Animated/CandyCrash.html +0 -151
  107. package/dist/paperjs/examples/Animated/Extruded.html +0 -50
  108. package/dist/paperjs/examples/Animated/Lines.html +0 -53
  109. package/dist/paperjs/examples/Animated/Smoothing.html +0 -70
  110. package/dist/paperjs/examples/Animated/Space.html +0 -86
  111. package/dist/paperjs/examples/Animated/SpaceUsingShapes.html +0 -79
  112. package/dist/paperjs/examples/Games/Paperoids.html +0 -569
  113. package/dist/paperjs/examples/JSON/Circle Testing.html +0 -34
  114. package/dist/paperjs/examples/JSON/Compound Path.html +0 -25
  115. package/dist/paperjs/examples/JSON/Empty Path Testing.html +0 -31
  116. package/dist/paperjs/examples/JSON/Gradients.html +0 -34
  117. package/dist/paperjs/examples/JSON/Group Transform.html +0 -28
  118. package/dist/paperjs/examples/JSON/Line Testing.html +0 -44
  119. package/dist/paperjs/examples/JSON/Random Path Testing.html +0 -42
  120. package/dist/paperjs/examples/JSON/Raster.html +0 -29
  121. package/dist/paperjs/examples/JSON/Rect and Attribute Testing.html +0 -56
  122. package/dist/paperjs/examples/JSON/Rotated Primitives.html +0 -55
  123. package/dist/paperjs/examples/JSON/Selection.html +0 -43
  124. package/dist/paperjs/examples/JSON/Shapes.html +0 -54
  125. package/dist/paperjs/examples/JSON/Symbols.html +0 -30
  126. package/dist/paperjs/examples/JSON/Text Testing.html +0 -38
  127. package/dist/paperjs/examples/JSON/Tiger.html +0 -19
  128. package/dist/paperjs/examples/JSON/Transform Test 1.html +0 -32
  129. package/dist/paperjs/examples/JSON/Transform Test 2.html +0 -30
  130. package/dist/paperjs/examples/Node.js/AnimatedStar.js +0 -52
  131. package/dist/paperjs/examples/Node.js/BooleanOperations.js +0 -36
  132. package/dist/paperjs/examples/Node.js/JSONtoPDF.js +0 -20
  133. package/dist/paperjs/examples/Node.js/Raster.js +0 -32
  134. package/dist/paperjs/examples/Node.js/RasterRemote.js +0 -33
  135. package/dist/paperjs/examples/Node.js/SvgExport.js +0 -52
  136. package/dist/paperjs/examples/Node.js/SvgImport.js +0 -23
  137. package/dist/paperjs/examples/Node.js/Tadpoles.js +0 -16
  138. package/dist/paperjs/examples/Node.js/Tadpoles.pjs +0 -278
  139. package/dist/paperjs/examples/Node.js/in.json +0 -1
  140. package/dist/paperjs/examples/Node.js/in.svg +0 -16
  141. package/dist/paperjs/examples/Paperjs.org/BooleanOperattions.html +0 -115
  142. package/dist/paperjs/examples/Paperjs.org/BouncingBalls.html +0 -103
  143. package/dist/paperjs/examples/Paperjs.org/Chain.html +0 -54
  144. package/dist/paperjs/examples/Paperjs.org/DivisionRaster.html +0 -72
  145. package/dist/paperjs/examples/Paperjs.org/FutureSplash.html +0 -122
  146. package/dist/paperjs/examples/Paperjs.org/HitTesting.html +0 -103
  147. package/dist/paperjs/examples/Paperjs.org/InteractiveTiger.html +0 -777
  148. package/dist/paperjs/examples/Paperjs.org/MetaBalls.html +0 -132
  149. package/dist/paperjs/examples/Paperjs.org/NyanRainbow.html +0 -202
  150. package/dist/paperjs/examples/Paperjs.org/PathIntersections.html +0 -76
  151. package/dist/paperjs/examples/Paperjs.org/Qbertify.html +0 -146
  152. package/dist/paperjs/examples/Paperjs.org/RadialRainbows.html +0 -80
  153. package/dist/paperjs/examples/Paperjs.org/RoundedRectangles.html +0 -41
  154. package/dist/paperjs/examples/Paperjs.org/SatieLikedToDraw.html +0 -140
  155. package/dist/paperjs/examples/Paperjs.org/Simplify.html +0 -63
  156. package/dist/paperjs/examples/Paperjs.org/SpiralRaster.html +0 -120
  157. package/dist/paperjs/examples/Paperjs.org/Tadpoles.html +0 -283
  158. package/dist/paperjs/examples/Paperjs.org/Voronoi.html +0 -134
  159. package/dist/paperjs/examples/Rasters/PhyllotaxisRaster.html +0 -96
  160. package/dist/paperjs/examples/Rasters/Raster.html +0 -34
  161. package/dist/paperjs/examples/Rasters/RotationRaster.html +0 -44
  162. package/dist/paperjs/examples/Rasters/Smoothing.html +0 -36
  163. package/dist/paperjs/examples/SVG Export/Circle Testing.html +0 -32
  164. package/dist/paperjs/examples/SVG Export/Clipping.html +0 -17
  165. package/dist/paperjs/examples/SVG Export/Compound Path.html +0 -22
  166. package/dist/paperjs/examples/SVG Export/Empty Path Testing.html +0 -28
  167. package/dist/paperjs/examples/SVG Export/Gradients.html +0 -52
  168. package/dist/paperjs/examples/SVG Export/Group Transform.html +0 -25
  169. package/dist/paperjs/examples/SVG Export/Line Testing.html +0 -41
  170. package/dist/paperjs/examples/SVG Export/Random Path Testing.html +0 -39
  171. package/dist/paperjs/examples/SVG Export/Raster.html +0 -21
  172. package/dist/paperjs/examples/SVG Export/Rect and Attribute Testing.html +0 -53
  173. package/dist/paperjs/examples/SVG Export/Rotated Primitives.html +0 -80
  174. package/dist/paperjs/examples/SVG Export/Shapes.html +0 -58
  175. package/dist/paperjs/examples/SVG Export/Symbols.html +0 -27
  176. package/dist/paperjs/examples/SVG Export/Text Testing.html +0 -45
  177. package/dist/paperjs/examples/SVG Export/Tiger.html +0 -23
  178. package/dist/paperjs/examples/SVG Export/Transform Test 1.html +0 -29
  179. package/dist/paperjs/examples/SVG Export/Transform Test 2.html +0 -27
  180. package/dist/paperjs/examples/SVG Import/Arcs.html +0 -78
  181. package/dist/paperjs/examples/SVG Import/Butterfly.html +0 -223
  182. package/dist/paperjs/examples/SVG Import/Circle and Ellipse Testing.html +0 -26
  183. package/dist/paperjs/examples/SVG Import/Clipping.html +0 -100
  184. package/dist/paperjs/examples/SVG Import/From File.html +0 -30
  185. package/dist/paperjs/examples/SVG Import/Gradient.html +0 -138
  186. package/dist/paperjs/examples/SVG Import/Gradients.html +0 -30
  187. package/dist/paperjs/examples/SVG Import/Inkscape Pivot.html +0 -52
  188. package/dist/paperjs/examples/SVG Import/Inkscape.html +0 -88
  189. package/dist/paperjs/examples/SVG Import/Line Testing.html +0 -24
  190. package/dist/paperjs/examples/SVG Import/MoreGradients.html +0 -107
  191. package/dist/paperjs/examples/SVG Import/Multiple Paths Test 1.html +0 -42
  192. package/dist/paperjs/examples/SVG Import/Multiple Paths Test 2.html +0 -33
  193. package/dist/paperjs/examples/SVG Import/Nested Groups Test.html +0 -78
  194. package/dist/paperjs/examples/SVG Import/Polybezier.html +0 -43
  195. package/dist/paperjs/examples/SVG Import/Rect Testing.html +0 -25
  196. package/dist/paperjs/examples/SVG Import/Symbols.html +0 -24
  197. package/dist/paperjs/examples/SVG Import/Testing.html +0 -40
  198. package/dist/paperjs/examples/SVG Import/Text Testing.html +0 -19
  199. package/dist/paperjs/examples/SVG Import/Tiger.html +0 -742
  200. package/dist/paperjs/examples/SVG Import/Transform Testing.html +0 -22
  201. package/dist/paperjs/examples/SVG Import/Viewbox.html +0 -38
  202. package/dist/paperjs/examples/Scripts/Arcs.html +0 -39
  203. package/dist/paperjs/examples/Scripts/BlendModes.html +0 -77
  204. package/dist/paperjs/examples/Scripts/BooleanOperations.html +0 -937
  205. package/dist/paperjs/examples/Scripts/CompoundPath.html +0 -19
  206. package/dist/paperjs/examples/Scripts/CurveTimeParameterization.html +0 -61
  207. package/dist/paperjs/examples/Scripts/HslColor.html +0 -53
  208. package/dist/paperjs/examples/Scripts/PathStructure.html +0 -82
  209. package/dist/paperjs/examples/Scripts/PathTangents.html +0 -73
  210. package/dist/paperjs/examples/Scripts/Resize.html +0 -42
  211. package/dist/paperjs/examples/Scripts/RoundRectangle.html +0 -28
  212. package/dist/paperjs/examples/Scripts/Shapes.html +0 -54
  213. package/dist/paperjs/examples/Scripts/StrokeBounds.html +0 -101
  214. package/dist/paperjs/examples/Scripts/StrokeScaling.html +0 -65
  215. package/dist/paperjs/examples/Tools/BezierTool.html +0 -90
  216. package/dist/paperjs/examples/Tools/Circles.html +0 -28
  217. package/dist/paperjs/examples/Tools/Clouds.html +0 -35
  218. package/dist/paperjs/examples/Tools/DrippingBrush.html +0 -73
  219. package/dist/paperjs/examples/Tools/FancyBrush.html +0 -82
  220. package/dist/paperjs/examples/Tools/Grid.html +0 -44
  221. package/dist/paperjs/examples/Tools/MultiLines.html +0 -44
  222. package/dist/paperjs/examples/Tools/MultipleTools.html +0 -44
  223. package/dist/paperjs/examples/Tools/PathEditing.html +0 -95
  224. package/dist/paperjs/examples/Tools/SquareRounded.html +0 -76
  225. package/dist/paperjs/examples/Tools/Stars.html +0 -38
  226. package/dist/paperjs/examples/Tools/Vektor.html +0 -200
  227. package/dist/paperjs/examples/Tools/Wave.html +0 -50
  228. package/dist/paperjs/examples/Tools/WormFarm.html +0 -88
  229. package/dist/paperjs/examples/Worker/Main.html +0 -53
  230. package/dist/paperjs/examples/Worker/Worker.js +0 -14
  231. package/dist/paperjs/examples/css/style.css +0 -12
package/dist/paperjs/docs/classes/Project.html DELETED
@@ -1,1305 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <meta charset="UTF-8">
5
- <title>Project</title>
6
- <base target="class-frame">
7
- <link href="../assets/css/docs.css" rel="stylesheet" type="text/css">
8
- <script src="../assets/js/paper.js"></script>
9
- <script src="../assets/js/jquery.js"></script>
10
- <script src="../assets/js/codemirror.js"></script>
11
- <script src="../assets/js/docs.js"></script>
12
- </head>
13
- <body>
14
- <article class="reference">
15
- <div class="reference-class">
16
- <h1>Project</h1>
17
-
18
- <p>A Project object in Paper.js is what usually is referred to as the document: The top level object that holds all the items contained in the scene graph. As the term document is already taken in the browser context, it is called Project.</p>
19
- <p>Projects allow the manipulation of the styles that are applied to all newly created items, give access to the selected items, and will in future versions offer ways to query for items in the scene graph defining specific requirements, and means to persist and load from different formats, such as SVG and PDF.</p>
20
- <p>The currently active project can be accessed through the <a href="../classes/PaperScope.html#project"><tt>paperScope.project</tt></a> variable.</p>
21
- <p>An array of all open projects is accessible through the <a href="../classes/PaperScope.html#projects"><tt>paperScope.projects</tt></a> variable.</p>
22
-
23
- </div>
24
-
25
- <!-- =============================== constructors ========================== -->
26
- <div class="reference-members">
27
- <h2>Constructors</h2>
28
-
29
-
30
- <div id="project-element" class="member">
31
- <div class="member-link">
32
- <a name="project-element" href="#project-element"><tt><b>Project</b>(element)</tt></a>
33
- </div>
34
- <div class="member-description hidden">
35
- <div class="member-text">
36
- <p>Creates a Paper.js project containing one empty <a href="../classes/Layer.html"><tt>Layer</tt></a>, referenced by <a href="../classes/Project.html#activelayer"><tt>project.activeLayer</tt></a>.</p>
37
- <p>Note that when working with PaperScript, a project is automatically created for us and the <a href="../classes/PaperScope.html#project"><tt>paperScope.project</tt></a> variable points to it.</p>
38
-
39
-
40
- <ul class="member-list">
41
- <h4>Parameters:</h4>
42
-
43
- <li>
44
- <tt>element:</tt>
45
- <tt>HTMLCanvasElement</tt>⟋<tt>String</tt>⟋<a href="../classes/Size.html"><tt>Size</tt></a>
46
- &mdash;&nbsp;the HTML canvas element that should be used as the element for the view, or an ID string by which to find the element, or the size of the canvas to be created for usage in a web worker.
47
-
48
- </li>
49
-
50
- </ul>
51
-
52
-
53
- <ul class="member-list">
54
- <h4>Returns:</h4>
55
-
56
- <li>
57
- <tt><a href="../classes/Project.html"><tt>Project</tt></a></tt>
58
- </li>
59
-
60
-
61
- </ul>
62
-
63
-
64
-
65
-
66
-
67
- </div>
68
- </div>
69
- </div>
70
-
71
- </div>
72
-
73
-
74
-
75
-
76
-
77
- <!-- ================================ properties =========================== -->
78
- <div class="reference-members">
79
- <h2>Properties</h2>
80
-
81
-
82
- <div id="view" class="member">
83
- <div class="member-link">
84
- <a name="view" href="#view"><tt><b>view</b></tt></a>
85
- </div>
86
- <div class="member-description hidden">
87
-
88
- <div class="member-text">
89
- <p>The reference to the project&rsquo;s view.</p>
90
-
91
- <p>Read only.</p>
92
-
93
-
94
-
95
- <ul class="member-list">
96
- <h4>Type:</h4>
97
- <li>
98
- <a href="../classes/View.html"><tt>View</tt></a>
99
- </li>
100
- </ul>
101
-
102
-
103
-
104
- </div>
105
-
106
- </div>
107
- </div>
108
-
109
-
110
- <div id="currentstyle" class="member">
111
- <div class="member-link">
112
- <a name="currentstyle" href="#currentstyle"><tt><b>currentStyle</b></tt></a>
113
- </div>
114
- <div class="member-description hidden">
115
-
116
- <div class="member-text">
117
- <p>The currently active path style. All selected items and newly created items will be styled with this style.</p>
118
-
119
-
120
-
121
- <ul class="member-list">
122
- <h4>Type:</h4>
123
- <li>
124
- <a href="../classes/Style.html"><tt>Style</tt></a>
125
- </li>
126
- </ul>
127
-
128
-
129
- <h4>Example:</h4>
130
-
131
- <div class="paperscript split">
132
-
133
- <div class="buttons">
134
- <div class="button run">Run</div>
135
- </div>
136
-
137
- <script type="text/paperscript" canvas="canvas-0">
138
- project.currentStyle = {
139
- fillColor: 'red',
140
- strokeColor: 'black',
141
- strokeWidth: 5
142
- }
143
-
144
- // The following paths will take over all style properties of
145
- // the current style:
146
- var path = new Path.Circle(new Point(75, 50), 30);
147
- var path2 = new Path.Circle(new Point(175, 50), 20);
148
- </script>
149
- <div class="canvas"><canvas width="516" height="100" id="canvas-0"></canvas></div>
150
- </div>
151
-
152
-
153
- <h4>Example:</h4>
154
-
155
- <div class="paperscript split">
156
-
157
- <div class="buttons">
158
- <div class="button run">Run</div>
159
- </div>
160
-
161
- <script type="text/paperscript" canvas="canvas-1">
162
- project.currentStyle.fillColor = 'red';
163
-
164
- // The following path will take over the fill color we just set:
165
- var path = new Path.Circle(new Point(75, 50), 30);
166
- var path2 = new Path.Circle(new Point(175, 50), 20);
167
- </script>
168
- <div class="canvas"><canvas width="516" height="100" id="canvas-1"></canvas></div>
169
- </div>
170
-
171
-
172
- </div>
173
-
174
- </div>
175
- </div>
176
-
177
-
178
- <div id="index" class="member">
179
- <div class="member-link">
180
- <a name="index" href="#index"><tt><b>index</b></tt></a>
181
- </div>
182
- <div class="member-description hidden">
183
-
184
- <div class="member-text">
185
- <p>The index of the project in the <a href="../classes/PaperScope.html#projects"><tt>paperScope.projects</tt></a> list.</p>
186
-
187
- <p>Read only.</p>
188
-
189
-
190
-
191
- <ul class="member-list">
192
- <h4>Type:</h4>
193
- <li>
194
- <tt>Number</tt>
195
- </li>
196
- </ul>
197
-
198
-
199
-
200
- </div>
201
-
202
- </div>
203
- </div>
204
-
205
-
206
- <h3>Project Content</h3>
207
-
208
- <div id="layers" class="member">
209
- <div class="member-link">
210
- <a name="layers" href="#layers"><tt><b>layers</b></tt></a>
211
- </div>
212
- <div class="member-description hidden">
213
-
214
- <div class="member-text">
215
- <p>The layers contained within the project.</p>
216
-
217
- <p>Read only.</p>
218
-
219
-
220
-
221
- <ul class="member-list">
222
- <h4>Type:</h4>
223
- <li>
224
- Array of <a href="../classes/Layer.html"><tt>Layer</tt></a> objects
225
- </li>
226
- </ul>
227
-
228
-
229
-
230
- </div>
231
-
232
- </div>
233
- </div>
234
-
235
-
236
- <div id="activelayer" class="member">
237
- <div class="member-link">
238
- <a name="activelayer" href="#activelayer"><tt><b>activeLayer</b></tt></a>
239
- </div>
240
- <div class="member-description hidden">
241
-
242
- <div class="member-text">
243
- <p>The layer which is currently active. New items will be created on this layer by default.</p>
244
-
245
- <p>Read only.</p>
246
-
247
-
248
-
249
- <ul class="member-list">
250
- <h4>Type:</h4>
251
- <li>
252
- <a href="../classes/Layer.html"><tt>Layer</tt></a>
253
- </li>
254
- </ul>
255
-
256
-
257
-
258
- </div>
259
-
260
- </div>
261
- </div>
262
-
263
-
264
- <div id="symboldefinitions" class="member">
265
- <div class="member-link">
266
- <a name="symboldefinitions" href="#symboldefinitions"><tt><b>symbolDefinitions</b></tt></a>
267
- </div>
268
- <div class="member-description hidden">
269
-
270
- <div class="member-text">
271
- <p>The symbol definitions shared by all symbol items contained place ind project.</p>
272
-
273
- <p>Read only.</p>
274
-
275
-
276
-
277
- <ul class="member-list">
278
- <h4>Type:</h4>
279
- <li>
280
- Array of <a href="../classes/SymbolDefinition.html"><tt>SymbolDefinition</tt></a> objects
281
- </li>
282
- </ul>
283
-
284
-
285
-
286
- </div>
287
-
288
- </div>
289
- </div>
290
-
291
-
292
- <div id="selecteditems" class="member">
293
- <div class="member-link">
294
- <a name="selecteditems" href="#selecteditems"><tt><b>selectedItems</b></tt></a>
295
- </div>
296
- <div class="member-description hidden">
297
-
298
- <div class="member-text">
299
- <p>The selected items contained within the project.</p>
300
-
301
- <p>Read only.</p>
302
-
303
-
304
-
305
- <ul class="member-list">
306
- <h4>Type:</h4>
307
- <li>
308
- Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
309
- </li>
310
- </ul>
311
-
312
-
313
-
314
- </div>
315
-
316
- </div>
317
- </div>
318
-
319
- </div>
320
-
321
-
322
-
323
-
324
-
325
- <!-- ============================== methods ================================ -->
326
- <div class="reference-members">
327
- <h2>Methods</h2>
328
-
329
-
330
- <div id="activate" class="member">
331
- <div class="member-link">
332
- <a name="activate" href="#activate"><tt><b>activate</b>()</tt></a>
333
- </div>
334
- <div class="member-description hidden">
335
- <div class="member-text">
336
- <p>Activates this project, so all newly created items will be placed in it.</p>
337
-
338
-
339
-
340
-
341
-
342
-
343
-
344
- </div>
345
- </div>
346
- </div>
347
-
348
-
349
- <div id="clear" class="member">
350
- <div class="member-link">
351
- <a name="clear" href="#clear"><tt><b>clear</b>()</tt></a>
352
- </div>
353
- <div class="member-description hidden">
354
- <div class="member-text">
355
- <p>Clears the project by removing all <a href="../classes/Project.html#layers"><tt>project.layers</tt></a>.</p>
356
-
357
-
358
-
359
-
360
-
361
-
362
-
363
- </div>
364
- </div>
365
- </div>
366
-
367
-
368
- <div id="isempty" class="member">
369
- <div class="member-link">
370
- <a name="isempty" href="#isempty"><tt><b>isEmpty</b>()</tt></a>
371
- </div>
372
- <div class="member-description hidden">
373
- <div class="member-text">
374
- <p>Checks whether the project has any content or not.</p>
375
-
376
-
377
-
378
- <ul class="member-list">
379
- <h4>Returns:</h4>
380
-
381
- <li>
382
- <tt><tt>Boolean</tt></tt>
383
- </li>
384
-
385
-
386
- </ul>
387
-
388
-
389
-
390
-
391
-
392
- </div>
393
- </div>
394
- </div>
395
-
396
-
397
- <div id="remove" class="member">
398
- <div class="member-link">
399
- <a name="remove" href="#remove"><tt><b>remove</b>()</tt></a>
400
- </div>
401
- <div class="member-description hidden">
402
- <div class="member-text">
403
- <p>Removes this project from the <a href="../classes/PaperScope.html#projects"><tt>paperScope.projects</tt></a> list, and also removes its view, if one was defined.</p>
404
-
405
-
406
-
407
-
408
-
409
-
410
-
411
- </div>
412
- </div>
413
- </div>
414
-
415
-
416
- <div id="selectall" class="member">
417
- <div class="member-link">
418
- <a name="selectall" href="#selectall"><tt><b>selectAll</b>()</tt></a>
419
- </div>
420
- <div class="member-description hidden">
421
- <div class="member-text">
422
- <p>Selects all items in the project.</p>
423
-
424
-
425
-
426
-
427
-
428
-
429
-
430
- </div>
431
- </div>
432
- </div>
433
-
434
-
435
- <div id="deselectall" class="member">
436
- <div class="member-link">
437
- <a name="deselectall" href="#deselectall"><tt><b>deselectAll</b>()</tt></a>
438
- </div>
439
- <div class="member-description hidden">
440
- <div class="member-text">
441
- <p>Deselects all selected items in the project.</p>
442
-
443
-
444
-
445
-
446
-
447
-
448
-
449
- </div>
450
- </div>
451
- </div>
452
-
453
-
454
- <h3>Hierarchy Operations</h3>
455
-
456
- <div id="addlayer-layer" class="member">
457
- <div class="member-link">
458
- <a name="addlayer-layer" href="#addlayer-layer"><tt><b>addLayer</b>(layer)</tt></a>
459
- </div>
460
- <div class="member-description hidden">
461
- <div class="member-text">
462
- <p>Adds the specified layer at the end of the this project&rsquo;s <a href="../classes/Project.html#layers"><tt>layers</tt></a> list.</p>
463
-
464
-
465
- <ul class="member-list">
466
- <h4>Parameters:</h4>
467
-
468
- <li>
469
- <tt>layer:</tt>
470
- <a href="../classes/Layer.html"><tt>Layer</tt></a>
471
- &mdash;&nbsp;the layer to be added to the project
472
-
473
- </li>
474
-
475
- </ul>
476
-
477
-
478
- <ul class="member-list">
479
- <h4>Returns:</h4>
480
-
481
- <li>
482
- <tt><a href="../classes/Layer.html"><tt>Layer</tt></a></tt>&nbsp;&mdash;&nbsp;the added layer, or <code>null</code> if adding was not possible
483
- </li>
484
-
485
-
486
- </ul>
487
-
488
-
489
-
490
-
491
-
492
- </div>
493
- </div>
494
- </div>
495
-
496
-
497
- <div id="insertlayer-index-layer" class="member">
498
- <div class="member-link">
499
- <a name="insertlayer-index-layer" href="#insertlayer-index-layer"><tt><b>insertLayer</b>(index, layer)</tt></a>
500
- </div>
501
- <div class="member-description hidden">
502
- <div class="member-text">
503
- <p>Inserts the specified layer at the specified index in this project&rsquo;s <a href="../classes/Project.html#layers"><tt>layers</tt></a> list.</p>
504
-
505
-
506
- <ul class="member-list">
507
- <h4>Parameters:</h4>
508
-
509
- <li>
510
- <tt>index:</tt>
511
- <tt>Number</tt>
512
- &mdash;&nbsp;the index at which to insert the layer
513
-
514
- </li>
515
-
516
- <li>
517
- <tt>layer:</tt>
518
- <a href="../classes/Layer.html"><tt>Layer</tt></a>
519
- &mdash;&nbsp;the layer to be inserted in the project
520
-
521
- </li>
522
-
523
- </ul>
524
-
525
-
526
- <ul class="member-list">
527
- <h4>Returns:</h4>
528
-
529
- <li>
530
- <tt><a href="../classes/Layer.html"><tt>Layer</tt></a></tt>&nbsp;&mdash;&nbsp;the added layer, or <code>null</code> if adding was not possible
531
- </li>
532
-
533
-
534
- </ul>
535
-
536
-
537
-
538
-
539
-
540
- </div>
541
- </div>
542
- </div>
543
-
544
-
545
- <h3>Hit-testing, Fetching and Matching Items</h3>
546
-
547
- <div id="hittest-point" class="member">
548
- <div class="member-link">
549
- <a name="hittest-point" href="#hittest-point"><tt><b>hitTest</b>(point[, options])</tt></a>
550
- </div>
551
- <div class="member-description hidden">
552
- <div class="member-text">
553
- <p>Performs a hit-test on the items contained within the project at the location of the specified point.</p>
554
- <p>The options object allows you to control the specifics of the hit-test and may contain a combination of the following values:</p>
555
- <ul class="member-list">
556
- <h4>Options:</h4>
557
- <li><tt>options.tolerance: <tt>Number</tt></tt> &mdash; the tolerance of the hit-test &mdash;&nbsp;default: <tt><a href="../classes/PaperScope.html#settings"><tt>paperScope.settings</tt></a>.hitTolerance</tt></li>
558
- <li><tt>options.class: <tt>Function</tt></tt> &mdash; only hit-test against a specific item class, or any of its sub-classes, by providing the constructor function against which an <code>instanceof</code> check is performed: <tt>Group</tt>, <tt>Layer</tt>, <tt>Path</tt>, <tt>CompoundPath</tt>, <tt>Shape</tt>, <tt>Raster</tt>, <tt>SymbolItem</tt>, <tt>PointText</tt>, &hellip;</li>
559
- <li><tt>options.match: <tt>Function</tt></tt> &mdash; a match function to be called for each found hit result: Return <code>true</code> to return the result, <code>false</code> to keep searching</li>
560
- <li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items &mdash;&nbsp;default: <tt>true</tt></li>
561
- <li><tt>options.stroke: <tt>Boolean</tt></tt> &mdash; hit-test the stroke of path items, taking into account the setting of stroke color and width &mdash;&nbsp;default: <tt>true</tt></li>
562
- <li><tt>options.segments: <tt>Boolean</tt></tt> &mdash; hit-test for <a href="../classes/Segment.html#point"><tt>segment.point</tt></a> of <a href="../classes/Path.html"><tt>Path</tt></a> items &mdash;&nbsp;default: <tt>true</tt></li>
563
- <li><tt>options.curves: <tt>Boolean</tt></tt> &mdash; hit-test the curves of path items, without taking the stroke color or width into account</li>
564
- <li><tt>options.handles: <tt>Boolean</tt></tt> &mdash; hit-test for the handles (<a href="../classes/Segment.html#handlein"><tt>segment.handleIn</tt></a> / <a href="../classes/Segment.html#handleout"><tt>segment.handleOut</tt></a>) of path segments.</li>
565
- <li><tt>options.ends: <tt>Boolean</tt></tt> &mdash; only hit-test for the first or last segment points of open path items</li>
566
- <li><tt>options.position: <tt>Boolean</tt></tt> &mdash; hit-test the <a href="../classes/Item.html#position"><tt>item.position</tt></a> of of items, which depends on the setting of <a href="../classes/Item.html#pivot"><tt>item.pivot</tt></a></li>
567
- <li><tt>options.center: <tt>Boolean</tt></tt> &mdash; hit-test the <a href="../classes/Rectangle.html#center"><tt>rectangle.center</tt></a> of the bounding rectangle of items (<a href="../classes/Item.html#bounds"><tt>item.bounds</tt></a>)</li>
568
- <li><tt>options.bounds: <tt>Boolean</tt></tt> &mdash; hit-test the corners and side-centers of the bounding rectangle of items (<a href="../classes/Item.html#bounds"><tt>item.bounds</tt></a>)</li>
569
- <li><tt>options.guides: <tt>Boolean</tt></tt> &mdash; hit-test items that have <tt>Item#guide</tt> set to <code>true</code></li>
570
- <li><tt>options.selected: <tt>Boolean</tt></tt> &mdash; only hit selected items</li>
571
- </ul>
572
-
573
- <ul class="member-list">
574
- <h4>Parameters:</h4>
575
-
576
- <li>
577
- <tt>point:</tt>
578
- <a href="../classes/Point.html"><tt>Point</tt></a>
579
- &mdash;&nbsp;the point where the hit-test should be performed
580
-
581
- </li>
582
-
583
- <li>
584
- <tt>options:</tt>
585
- <tt>Object</tt>
586
-
587
- &mdash;&nbsp;optional, default: <tt>{ fill: true, stroke: true, segments: true, tolerance: settings.hitTolerance }</tt>
588
- </li>
589
-
590
- </ul>
591
-
592
-
593
- <ul class="member-list">
594
- <h4>Returns:</h4>
595
-
596
- <li>
597
- <tt><a href="../classes/HitResult.html"><tt>HitResult</tt></a></tt>&nbsp;&mdash;&nbsp;a hit result object that contains more information about what exactly was hit or <code>null</code> if nothing was hit
598
- </li>
599
-
600
-
601
- </ul>
602
-
603
-
604
-
605
-
606
-
607
- </div>
608
- </div>
609
- </div>
610
-
611
-
612
- <div id="hittestall-point" class="member">
613
- <div class="member-link">
614
- <a name="hittestall-point" href="#hittestall-point"><tt><b>hitTestAll</b>(point[, options])</tt></a>
615
- </div>
616
- <div class="member-description hidden">
617
- <div class="member-text">
618
- <p>Performs a hit-test on the item and its children (if it is a <a href="../classes/Group.html"><tt>Group</tt></a> or <a href="../classes/Layer.html"><tt>Layer</tt></a>) at the location of the specified point, returning all found hits.</p>
619
- <p>The options object allows you to control the specifics of the hit- test. See <a href="../classes/Project.html#hittest-point"><tt>hitTest(point[, options])</tt></a> for a list of all options.</p>
620
-
621
-
622
- <ul class="member-list">
623
- <h4>Parameters:</h4>
624
-
625
- <li>
626
- <tt>point:</tt>
627
- <a href="../classes/Point.html"><tt>Point</tt></a>
628
- &mdash;&nbsp;the point where the hit-test should be performed
629
-
630
- </li>
631
-
632
- <li>
633
- <tt>options:</tt>
634
- <tt>Object</tt>
635
-
636
- &mdash;&nbsp;optional, default: <tt>{ fill: true, stroke: true, segments: true, tolerance: settings.hitTolerance }</tt>
637
- </li>
638
-
639
- </ul>
640
-
641
-
642
- <ul class="member-list">
643
- <h4>Returns:</h4>
644
-
645
- <li>
646
- <tt>Array of <a href="../classes/HitResult.html"><tt>HitResult</tt></a> objects</tt>&nbsp;&mdash;&nbsp;hit result objects for all hits, describing what exactly was hit or <code>null</code> if nothing was hit
647
- </li>
648
-
649
-
650
- </ul>
651
-
652
-
653
-
654
-
655
- <ul class="member-list">
656
- <h4>See also:</h4>
657
-
658
- <li><tt><a href="../classes/Project.html#hittest-point"><tt>hitTest(point[, options])</tt></a>;</tt></li>
659
-
660
- </ul>
661
-
662
-
663
- </div>
664
- </div>
665
- </div>
666
-
667
-
668
- <div id="getitems-options" class="member">
669
- <div class="member-link">
670
- <a name="getitems-options" href="#getitems-options"><tt><b>getItems</b>(options)</tt></a>
671
- </div>
672
- <div class="member-description hidden">
673
- <div class="member-text">
674
- <p>Fetch items contained within the project whose properties match the criteria in the specified object.</p>
675
- <p>Extended matching of properties is possible by providing a comparator function or regular expression. Matching points, colors only work as a comparison of the full object, not partial matching (e.g. only providing the x- coordinate to match all points with that x-value). Partial matching does work for <a href="../classes/Item.html#data"><tt>item.data</tt></a>.</p>
676
- <p>Matching items against a rectangular area is also possible, by setting either <code>options.inside</code> or <code>options.overlapping</code> to a rectangle describing the area in which the items either have to be fully or partly contained.</p>
677
- <ul class="member-list">
678
- <h4>Options:</h4>
679
- <li><tt>options.recursive: <tt>Boolean</tt></tt> &mdash; whether to loop recursively through all children, or stop at the current level &mdash;&nbsp;default: <tt>true</tt></li>
680
- <li><tt>options.match: <tt>Function</tt></tt> &mdash; a match function to be called for each item, allowing the definition of more flexible item checks that are not bound to properties. If no other match properties are defined, this function can also be passed instead of the <code>match</code> object</li>
681
- <li><tt>options.class: <tt>Function</tt></tt> &mdash; the constructor function of the item type to match against</li>
682
- <li><tt>options.inside: <a href="../classes/Rectangle.html"><tt>Rectangle</tt></a></tt> &mdash; the rectangle in which the items need to be fully contained</li>
683
- <li><tt>options.overlapping: <a href="../classes/Rectangle.html"><tt>Rectangle</tt></a></tt> &mdash; the rectangle with which the items need to at least partly overlap</li>
684
- </ul>
685
-
686
- <ul class="member-list">
687
- <h4>Parameters:</h4>
688
-
689
- <li>
690
- <tt>options:</tt>
691
- <tt>Object</tt>⟋<tt>Function</tt>
692
- &mdash;&nbsp;the criteria to match against
693
-
694
- </li>
695
-
696
- </ul>
697
-
698
-
699
- <ul class="member-list">
700
- <h4>Returns:</h4>
701
-
702
- <li>
703
- <tt>Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects</tt>&nbsp;&mdash;&nbsp;the list of matching items contained in the project
704
- </li>
705
-
706
-
707
- </ul>
708
-
709
-
710
-
711
-
712
- <ul class="member-list">
713
- <h4>See also:</h4>
714
-
715
- <li><tt><a href="../classes/Item.html#matches-options"><tt>item.matches(options)</tt></a></tt></li>
716
-
717
- <li><tt><a href="../classes/Item.html#getitems-options"><tt>item.getItems(options)</tt></a></tt></li>
718
-
719
- </ul>
720
-
721
- <h4>Example:<span class="description">Fetch all selected path items:</span></h4>
722
-
723
- <div class="paperscript split">
724
-
725
- <div class="buttons">
726
- <div class="button run">Run</div>
727
- </div>
728
-
729
- <script type="text/paperscript" canvas="canvas-2">
730
- var path1 = new Path.Circle({
731
- center: [50, 50],
732
- radius: 25,
733
- fillColor: 'black'
734
- });
735
-
736
- var path2 = new Path.Circle({
737
- center: [150, 50],
738
- radius: 25,
739
- fillColor: 'black'
740
- });
741
-
742
- // Select path2:
743
- path2.selected = true;
744
-
745
- // Fetch all selected path items:
746
- var items = project.getItems({
747
- selected: true,
748
- class: Path
749
- });
750
-
751
- // Change the fill color of the selected path to red:
752
- items[0].fillColor = 'red';
753
- </script>
754
- <div class="canvas"><canvas width="516" height="100" id="canvas-2"></canvas></div>
755
- </div>
756
-
757
-
758
- <h4>Example:<span class="description">Fetch all items with a specific fill color:</span></h4>
759
-
760
- <div class="paperscript split">
761
-
762
- <div class="buttons">
763
- <div class="button run">Run</div>
764
- </div>
765
-
766
- <script type="text/paperscript" canvas="canvas-3">
767
- var path1 = new Path.Circle({
768
- center: [50, 50],
769
- radius: 25,
770
- fillColor: 'black'
771
- });
772
-
773
- var path2 = new Path.Circle({
774
- center: [150, 50],
775
- radius: 25,
776
- fillColor: 'purple'
777
- });
778
-
779
- // Fetch all items with a purple fill color:
780
- var items = project.getItems({
781
- fillColor: 'purple'
782
- });
783
-
784
- // Select the fetched item:
785
- items[0].selected = true;
786
- </script>
787
- <div class="canvas"><canvas width="516" height="100" id="canvas-3"></canvas></div>
788
- </div>
789
-
790
-
791
- <h4>Example:<span class="description">Fetch items at a specific position:</span></h4>
792
-
793
- <div class="paperscript split">
794
-
795
- <div class="buttons">
796
- <div class="button run">Run</div>
797
- </div>
798
-
799
- <script type="text/paperscript" canvas="canvas-4">
800
- var path1 = new Path.Circle({
801
- center: [50, 50],
802
- radius: 25,
803
- fillColor: 'black'
804
- });
805
-
806
- var path2 = new Path.Circle({
807
- center: [150, 50],
808
- radius: 25,
809
- fillColor: 'black'
810
- });
811
-
812
- // Fetch all path items positioned at {x: 150, y: 150}:
813
- var items = project.getItems({
814
- position: [150, 50]
815
- });
816
-
817
- // Select the fetched path:
818
- items[0].selected = true;
819
- </script>
820
- <div class="canvas"><canvas width="516" height="100" id="canvas-4"></canvas></div>
821
- </div>
822
-
823
-
824
- <h4>Example:<span class="description">Fetch items using a comparator function:</span></h4>
825
-
826
- <div class="paperscript split">
827
-
828
- <div class="buttons">
829
- <div class="button run">Run</div>
830
- </div>
831
-
832
- <script type="text/paperscript" canvas="canvas-5">
833
- // Create a circle shaped path:
834
- var path1 = new Path.Circle({
835
- center: [50, 50],
836
- radius: 25,
837
- fillColor: 'black'
838
- });
839
-
840
- // Create a circle shaped path with 50% opacity:
841
- var path2 = new Path.Circle({
842
- center: [150, 50],
843
- radius: 25,
844
- fillColor: 'black',
845
- opacity: 0.5
846
- });
847
-
848
- // Fetch all items whose opacity is smaller than 1
849
- var items = paper.project.getItems({
850
- opacity: function(value) {
851
- return value < 1;
852
- }
853
- });
854
-
855
- // Select the fetched item:
856
- items[0].selected = true;
857
- </script>
858
- <div class="canvas"><canvas width="516" height="100" id="canvas-5"></canvas></div>
859
- </div>
860
-
861
-
862
- <h4>Example:<span class="description">Fetch items using a comparator function (2):</span></h4>
863
-
864
- <div class="paperscript split">
865
-
866
- <div class="buttons">
867
- <div class="button run">Run</div>
868
- </div>
869
-
870
- <script type="text/paperscript" canvas="canvas-6">
871
- // Create a rectangle shaped path (4 segments):
872
- var path1 = new Path.Rectangle({
873
- from: [25, 25],
874
- to: [75, 75],
875
- strokeColor: 'black',
876
- strokeWidth: 10
877
- });
878
-
879
- // Create a line shaped path (2 segments):
880
- var path2 = new Path.Line({
881
- from: [125, 50],
882
- to: [175, 50],
883
- strokeColor: 'black',
884
- strokeWidth: 10
885
- });
886
-
887
- // Fetch all paths with 2 segments:
888
- var items = project.getItems({
889
- class: Path,
890
- segments: function(segments) {
891
- return segments.length == 2;
892
- }
893
- });
894
-
895
- // Select the fetched path:
896
- items[0].selected = true;
897
- </script>
898
- <div class="canvas"><canvas width="516" height="100" id="canvas-6"></canvas></div>
899
- </div>
900
-
901
-
902
- <h4>Example:<span class="description">Match (nested) properties of the data property:</span></h4>
903
-
904
- <div class="paperscript split">
905
-
906
- <div class="buttons">
907
- <div class="button run">Run</div>
908
- </div>
909
-
910
- <script type="text/paperscript" canvas="canvas-7">
911
- // Create a black circle shaped path:
912
- var path1 = new Path.Circle({
913
- center: [50, 50],
914
- radius: 25,
915
- fillColor: 'black',
916
- data: {
917
- person: {
918
- name: 'john',
919
- length: 200,
920
- hair: true
921
- }
922
- }
923
- });
924
-
925
- // Create a red circle shaped path:
926
- var path2 = new Path.Circle({
927
- center: [150, 50],
928
- radius: 25,
929
- fillColor: 'red',
930
- data: {
931
- person: {
932
- name: 'john',
933
- length: 180,
934
- hair: false
935
- }
936
- }
937
- });
938
-
939
- // Fetch all items whose data object contains a person
940
- // object whose name is john and length is 180:
941
- var items = paper.project.getItems({
942
- data: {
943
- person: {
944
- name: 'john',
945
- length: 180
946
- }
947
- }
948
- });
949
-
950
- // Select the fetched item:
951
- items[0].selected = true;
952
- </script>
953
- <div class="canvas"><canvas width="516" height="100" id="canvas-7"></canvas></div>
954
- </div>
955
-
956
-
957
- <h4>Example:<span class="description">Match strings using regular expressions:</span></h4>
958
-
959
- <div class="paperscript split">
960
-
961
- <div class="buttons">
962
- <div class="button run">Run</div>
963
- </div>
964
-
965
- <script type="text/paperscript" canvas="canvas-8">
966
- // Create a path named 'aardvark':
967
- var path1 = new Path.Circle({
968
- center: [50, 50],
969
- radius: 25,
970
- fillColor: 'black',
971
- name: 'aardvark'
972
- });
973
-
974
- // Create a path named 'apple':
975
- var path2 = new Path.Circle({
976
- center: [150, 50],
977
- radius: 25,
978
- fillColor: 'black',
979
- name: 'apple'
980
- });
981
-
982
- // Create a path named 'banana':
983
- var path2 = new Path.Circle({
984
- center: [250, 50],
985
- radius: 25,
986
- fillColor: 'black',
987
- name: 'banana'
988
- });
989
-
990
- // Fetch all items that have a name starting with 'a':
991
- var items = project.getItems({
992
- name: /^a/
993
- });
994
-
995
- // Change the fill color of the matched items:
996
- for (var i = 0; i < items.length; i++) {
997
- items[i].fillColor = 'red';
998
- }
999
- </script>
1000
- <div class="canvas"><canvas width="516" height="100" id="canvas-8"></canvas></div>
1001
- </div>
1002
-
1003
-
1004
- </div>
1005
- </div>
1006
- </div>
1007
-
1008
-
1009
- <div id="getitem-options" class="member">
1010
- <div class="member-link">
1011
- <a name="getitem-options" href="#getitem-options"><tt><b>getItem</b>(options)</tt></a>
1012
- </div>
1013
- <div class="member-description hidden">
1014
- <div class="member-text">
1015
- <p>Fetch the first item contained within the project whose properties match the criteria in the specified object. Extended matching is possible by providing a compare function or regular expression. Matching points, colors only work as a comparison of the full object, not partial matching (e.g. only providing the x- coordinate to match all points with that x-value). Partial matching does work for <a href="../classes/Item.html#data"><tt>item.data</tt></a>.</p>
1016
- <p>See <a href="../classes/Project.html#getitems-options"><tt>getItems(options)</tt></a> for a selection of illustrated examples.</p>
1017
-
1018
-
1019
- <ul class="member-list">
1020
- <h4>Parameters:</h4>
1021
-
1022
- <li>
1023
- <tt>options:</tt>
1024
- <tt>Object</tt>⟋<tt>Function</tt>
1025
- &mdash;&nbsp;the criteria to match against
1026
-
1027
- </li>
1028
-
1029
- </ul>
1030
-
1031
-
1032
- <ul class="member-list">
1033
- <h4>Returns:</h4>
1034
-
1035
- <li>
1036
- <tt><a href="../classes/Item.html"><tt>Item</tt></a></tt>&nbsp;&mdash;&nbsp;the first item in the project matching the given criteria
1037
- </li>
1038
-
1039
-
1040
- </ul>
1041
-
1042
-
1043
-
1044
-
1045
-
1046
- </div>
1047
- </div>
1048
- </div>
1049
-
1050
-
1051
- <h3>Importing / Exporting JSON and SVG</h3>
1052
-
1053
- <div id="exportjson" class="member">
1054
- <div class="member-link">
1055
- <a name="exportjson" href="#exportjson"><tt><b>exportJSON</b>([options])</tt></a>
1056
- </div>
1057
- <div class="member-description hidden">
1058
- <div class="member-text">
1059
- <p>Exports (serializes) the project with all its layers and child items to a JSON data object or string.</p>
1060
- <ul class="member-list">
1061
- <h4>Options:</h4>
1062
- <li><tt>options.asString: <tt>Boolean</tt></tt> &mdash; whether the JSON is returned as a <code>Object</code> or a <code>String</code> &mdash;&nbsp;default: <tt>true</tt></li>
1063
- <li><tt>options.precision: <tt>Number</tt></tt> &mdash; the amount of fractional digits in numbers used in JSON data &mdash;&nbsp;default: <tt>5</tt></li>
1064
- </ul>
1065
-
1066
- <ul class="member-list">
1067
- <h4>Parameters:</h4>
1068
-
1069
- <li>
1070
- <tt>options:</tt>
1071
- <tt>Object</tt>
1072
- &mdash;&nbsp;the serialization options
1073
- &mdash;&nbsp;optional
1074
- </li>
1075
-
1076
- </ul>
1077
-
1078
-
1079
- <ul class="member-list">
1080
- <h4>Returns:</h4>
1081
-
1082
- <li>
1083
- <tt><tt>String</tt></tt>&nbsp;&mdash;&nbsp;the exported JSON data
1084
- </li>
1085
-
1086
-
1087
- </ul>
1088
-
1089
-
1090
-
1091
-
1092
-
1093
- </div>
1094
- </div>
1095
- </div>
1096
-
1097
-
1098
- <div id="importjson-json" class="member">
1099
- <div class="member-link">
1100
- <a name="importjson-json" href="#importjson-json"><tt><b>importJSON</b>(json)</tt></a>
1101
- </div>
1102
- <div class="member-description hidden">
1103
- <div class="member-text">
1104
- <p>Imports (deserializes) the stored JSON data into the project. Note that the project is not cleared first. You can call <a href="../classes/Project.html#clear"><tt>project.clear</tt></a>() to do so.</p>
1105
-
1106
-
1107
- <ul class="member-list">
1108
- <h4>Parameters:</h4>
1109
-
1110
- <li>
1111
- <tt>json:</tt>
1112
- <tt>String</tt>
1113
- &mdash;&nbsp;the JSON data to import from
1114
-
1115
- </li>
1116
-
1117
- </ul>
1118
-
1119
-
1120
- <ul class="member-list">
1121
- <h4>Returns:</h4>
1122
-
1123
- <li>
1124
- <tt><a href="../classes/Item.html"><tt>Item</tt></a></tt>&nbsp;&mdash;&nbsp;the imported item
1125
- </li>
1126
-
1127
-
1128
- </ul>
1129
-
1130
-
1131
-
1132
-
1133
-
1134
- </div>
1135
- </div>
1136
- </div>
1137
-
1138
-
1139
- <div id="exportsvg" class="member">
1140
- <div class="member-link">
1141
- <a name="exportsvg" href="#exportsvg"><tt><b>exportSVG</b>([options])</tt></a>
1142
- </div>
1143
- <div class="member-description hidden">
1144
- <div class="member-text">
1145
- <p>Exports the project with all its layers and child items as an SVG DOM, all contained in one top level SVG group node.</p>
1146
- <ul class="member-list">
1147
- <h4>Options:</h4>
1148
- <li><tt>options.bounds: <tt>String</tt>⟋<a href="../classes/Rectangle.html"><tt>Rectangle</tt></a></tt> &mdash; the bounds of the area to export, either as a string (<tt>&lsquo;view&rsquo;</tt>, <tt>content&rsquo;</tt>), or a <a href="../classes/Rectangle.html"><tt>Rectangle</tt></a> object: <code>&#39;view&#39;</code> uses the view bounds, <code>&#39;content&#39;</code> uses the stroke bounds of all content &mdash;&nbsp;default: <tt>&lsquo;view&rsquo;</tt></li>
1149
- <li><tt>options.matrix: <a href="../classes/Matrix.html"><tt>Matrix</tt></a></tt> &mdash; the matrix with which to transform the exported content: If <code>options.bounds</code> is set to <code>&#39;view&#39;</code>, <code>paper.view.matrix</code> is used, for all other settings of <code>options.bounds</code> the identity matrix is used. &mdash;&nbsp;default: <tt>paper.view.matrix</tt></li>
1150
- <li><tt>options.asString: <tt>Boolean</tt></tt> &mdash; whether a SVG node or a <code>String</code> is to be returned &mdash;&nbsp;default: <tt>false</tt></li>
1151
- <li><tt>options.precision: <tt>Number</tt></tt> &mdash; the amount of fractional digits in numbers used in SVG data &mdash;&nbsp;default: <tt>5</tt></li>
1152
- <li><tt>options.matchShapes: <tt>Boolean</tt></tt> &mdash; whether path items should tried to be converted to SVG shape items (rect, circle, ellipse, line, polyline, polygon), if their geometries match &mdash;&nbsp;default: <tt>false</tt></li>
1153
- <li><tt>options.embedImages: <tt>Boolean</tt></tt> &mdash; whether raster images should be embedded as base64 data inlined in the xlink:href attribute, or kept as a link to their external URL. &mdash;&nbsp;default: <tt>true</tt></li>
1154
- </ul>
1155
-
1156
- <ul class="member-list">
1157
- <h4>Parameters:</h4>
1158
-
1159
- <li>
1160
- <tt>options:</tt>
1161
- <tt>Object</tt>
1162
- &mdash;&nbsp;the export options
1163
- &mdash;&nbsp;optional
1164
- </li>
1165
-
1166
- </ul>
1167
-
1168
-
1169
- <ul class="member-list">
1170
- <h4>Returns:</h4>
1171
-
1172
- <li>
1173
- <tt><tt>SVGElement</tt>⟋<tt>String</tt></tt>&nbsp;&mdash;&nbsp;the project converted to an SVG node or a <code>String</code> depending on <code>option.asString</code> value
1174
- </li>
1175
-
1176
-
1177
- </ul>
1178
-
1179
-
1180
-
1181
-
1182
-
1183
- </div>
1184
- </div>
1185
- </div>
1186
-
1187
-
1188
- <div id="importsvg-svg" class="member">
1189
- <div class="member-link">
1190
- <a name="importsvg-svg" href="#importsvg-svg"><tt><b>importSVG</b>(svg[, options])</tt></a>
1191
- </div>
1192
- <div class="member-description hidden">
1193
- <div class="member-text">
1194
- <p>Converts the provided SVG content into Paper.js items and adds them to the active layer of this project. Note that the project is not cleared first. You can call <a href="../classes/Project.html#clear"><tt>project.clear</tt></a>() to do so.</p>
1195
- <ul class="member-list">
1196
- <h4>Options:</h4>
1197
- <li><tt>options.expandShapes: <tt>Boolean</tt></tt> &mdash; whether imported shape items should be expanded to path items &mdash;&nbsp;default: <tt>false</tt></li>
1198
- <li><tt>options.onLoad: <tt>Function</tt></tt> &mdash; the callback function to call once the SVG content is loaded from the given URL receiving two arguments: the converted <code>item</code> and the original <code>svg</code> data as a string. Only required when loading from external resources.</li>
1199
- <li><tt>options.onError: <tt>Function</tt></tt> &mdash; the callback function to call if an error occurs during loading. Only required when loading from external resources.</li>
1200
- <li><tt>options.insert: <tt>Boolean</tt></tt> &mdash; whether the imported items should be added to the project that <code>importSVG()</code> is called on &mdash;&nbsp;default: <tt>true</tt></li>
1201
- <li><tt>options.applyMatrix: <tt>Boolean</tt></tt> &mdash; whether the imported items should have their transformation matrices applied to their contents or not &mdash;&nbsp;default: <tt><a href="../classes/PaperScope.html#settings"><tt>paperScope.settings</tt></a>.applyMatrix</tt></li>
1202
- </ul>
1203
-
1204
- <ul class="member-list">
1205
- <h4>Parameters:</h4>
1206
-
1207
- <li>
1208
- <tt>svg:</tt>
1209
- <tt>SVGElement</tt>⟋<tt>String</tt>
1210
- &mdash;&nbsp;the SVG content to import, either as a SVG DOM node, a string containing SVG content, or a string describing the URL of the SVG file to fetch.
1211
-
1212
- </li>
1213
-
1214
- <li>
1215
- <tt>options:</tt>
1216
- <tt>Object</tt>
1217
- &mdash;&nbsp;the import options
1218
- &mdash;&nbsp;optional
1219
- </li>
1220
-
1221
- </ul>
1222
-
1223
-
1224
- <ul class="member-list">
1225
- <h4>Returns:</h4>
1226
-
1227
- <li>
1228
- <tt><a href="../classes/Item.html"><tt>Item</tt></a></tt>&nbsp;&mdash;&nbsp;the newly created Paper.js item containing the converted SVG content
1229
- </li>
1230
-
1231
-
1232
- </ul>
1233
-
1234
-
1235
-
1236
-
1237
-
1238
- </div>
1239
- </div>
1240
- </div>
1241
-
1242
-
1243
- <div id="importsvg-svg-onLoad" class="member">
1244
- <div class="member-link">
1245
- <a name="importsvg-svg-onLoad" href="#importsvg-svg-onLoad"><tt><b>importSVG</b>(svg, onLoad)</tt></a>
1246
- </div>
1247
- <div class="member-description hidden">
1248
- <div class="member-text">
1249
- <p>Imports the provided external SVG file, converts it into Paper.js items and adds them to the active layer of this project. Note that the project is not cleared first. You can call <a href="../classes/Project.html#clear"><tt>project.clear</tt></a>() to do so.</p>
1250
-
1251
-
1252
- <ul class="member-list">
1253
- <h4>Parameters:</h4>
1254
-
1255
- <li>
1256
- <tt>svg:</tt>
1257
- <tt>SVGElement</tt>⟋<tt>String</tt>
1258
- &mdash;&nbsp;the URL of the SVG file to fetch.
1259
-
1260
- </li>
1261
-
1262
- <li>
1263
- <tt>onLoad:</tt>
1264
- <tt>Function</tt>
1265
- &mdash;&nbsp;the callback function to call once the SVG content is loaded from the given URL receiving two arguments: the converted <code>item</code> and the original <code>svg</code> data as a string. Only required when loading from external files.
1266
-
1267
- </li>
1268
-
1269
- </ul>
1270
-
1271
-
1272
- <ul class="member-list">
1273
- <h4>Returns:</h4>
1274
-
1275
- <li>
1276
- <tt><a href="../classes/Item.html"><tt>Item</tt></a></tt>&nbsp;&mdash;&nbsp;the newly created Paper.js item containing the converted SVG content
1277
- </li>
1278
-
1279
-
1280
- </ul>
1281
-
1282
-
1283
-
1284
-
1285
-
1286
- </div>
1287
- </div>
1288
- </div>
1289
-
1290
-
1291
-
1292
- </div>
1293
-
1294
-
1295
-
1296
-
1297
- <!-- =========================== copyright notice ========================== -->
1298
- <p class="footer">
1299
- Paper.js v0.12.17<br>
1300
- Copyright &#169; 2011—2022 <a href="http://www.lehni.org" target="_blank">J&uuml;rg Lehni</a> &amp; <a href="http://www.jonathanpuckey.com" target="_blank">Jonathan Puckey</a>. All Rights Reserved.</p>
1301
- <div class="content-end"></div>
1302
-
1303
-
1304
- </article>
1305
- </body>