mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2025-07-29 15:19:20 -04:00
Whitespace. Removed all trailing whitespace from .js files
This commit is contained in:
parent
cb0eab92b9
commit
ac39873693
50 changed files with 1279 additions and 1279 deletions
src/path
292
src/path/Path.js
292
src/path/Path.js
|
@ -1,40 +1,40 @@
|
|||
/*
|
||||
* Paper.js
|
||||
*
|
||||
*
|
||||
* This file is part of Paper.js, a JavaScript Vector Graphics Library,
|
||||
* based on Scriptographer.org and designed to be largely API compatible.
|
||||
* http://paperjs.org/
|
||||
* http://scriptographer.org/
|
||||
*
|
||||
*
|
||||
* Distributed under the MIT license. See LICENSE file for details.
|
||||
*
|
||||
*
|
||||
* Copyright (c) 2011, Juerg Lehni & Jonathan Puckey
|
||||
* http://lehni.org/ & http://jonathanpuckey.com/
|
||||
*
|
||||
*
|
||||
* All rights reserved.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @name Path
|
||||
*
|
||||
*
|
||||
* @class The Path item represents a path in a Paper.js project.
|
||||
*
|
||||
*
|
||||
* @extends PathItem
|
||||
*/
|
||||
var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
||||
/**
|
||||
* Creates a new Path item and places it at the top of the active layer.
|
||||
*
|
||||
*
|
||||
* @param {Segment[]} [segments] An array of segments (or points to be
|
||||
* converted to segments) that will be added to the path.
|
||||
*
|
||||
*
|
||||
* @example
|
||||
* // Create an empty path and add segments to it:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.add(new Point(30, 30));
|
||||
* path.add(new Point(100, 100));
|
||||
*
|
||||
*
|
||||
* @example
|
||||
* // Create a path with two segments:
|
||||
* var segments = [new Point(30, 30), new Point(100, 100)];
|
||||
|
@ -75,7 +75,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* The segments contained within the path.
|
||||
*
|
||||
*
|
||||
* @type Segment[]
|
||||
* @bean
|
||||
*/
|
||||
|
@ -98,7 +98,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* The first Segment contained within the path.
|
||||
*
|
||||
*
|
||||
* @type Segment
|
||||
* @bean
|
||||
*/
|
||||
|
@ -108,7 +108,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* The last Segment contained within the path.
|
||||
*
|
||||
*
|
||||
* @type Segment
|
||||
* @bean
|
||||
*/
|
||||
|
@ -118,7 +118,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* The curves contained within the path.
|
||||
*
|
||||
*
|
||||
* @type Curve[]
|
||||
* @bean
|
||||
*/
|
||||
|
@ -140,7 +140,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* The first Curve contained within the path.
|
||||
*
|
||||
*
|
||||
* @type Curve
|
||||
* @bean
|
||||
*/
|
||||
|
@ -150,7 +150,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* The last Curve contained within the path.
|
||||
*
|
||||
*
|
||||
* @type Curve
|
||||
* @bean
|
||||
*/
|
||||
|
@ -162,17 +162,17 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Specifies whether the path is closed. If it is closed, Paper.js connects
|
||||
* the first and last segments.
|
||||
*
|
||||
*
|
||||
* @type Boolean
|
||||
* @bean
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* var myPath = new Path();
|
||||
* myPath.strokeColor = 'black';
|
||||
* myPath.add(new Point(50, 75));
|
||||
* myPath.add(new Point(100, 25));
|
||||
* myPath.add(new Point(150, 75));
|
||||
*
|
||||
*
|
||||
* // Close the path:
|
||||
* myPath.closed = true;
|
||||
*/
|
||||
|
@ -286,64 +286,64 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Adds one or more segments to the end of the {@link #segments} array of
|
||||
* this path.
|
||||
*
|
||||
*
|
||||
* @param {Segment|Point} segment the segment or point to be added.
|
||||
* @return {Segment} the added segment. This is not necessarily the same
|
||||
* object, e.g. if the segment to be added already belongs to another path.
|
||||
* @operator none
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Adding segments to a path using point objects:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Add a segment at {x: 30, y: 75}
|
||||
* path.add(new Point(30, 75));
|
||||
*
|
||||
*
|
||||
* // Add two segments in one go at {x: 100, y: 20}
|
||||
* // and {x: 170, y: 75}:
|
||||
* path.add(new Point(100, 20), new Point(170, 75));
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Adding segments to a path using arrays containing number pairs:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Add a segment at {x: 30, y: 75}
|
||||
* path.add([30, 75]);
|
||||
*
|
||||
*
|
||||
* // Add two segments in one go at {x: 100, y: 20}
|
||||
* // and {x: 170, y: 75}:
|
||||
* path.add([100, 20], [170, 75]);
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Adding segments to a path using objects:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Add a segment at {x: 30, y: 75}
|
||||
* path.add({x: 30, y: 75});
|
||||
*
|
||||
*
|
||||
* // Add two segments in one go at {x: 100, y: 20}
|
||||
* // and {x: 170, y: 75}:
|
||||
* path.add({x: 100, y: 20}, {x: 170, y: 75});
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Adding a segment with handles to a path:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* path.add(new Point(30, 75));
|
||||
*
|
||||
*
|
||||
* // Add a segment with handles:
|
||||
* var point = new Point(100, 20);
|
||||
* var handleIn = new Point(-50, 0);
|
||||
* var handleOut = new Point(50, 0);
|
||||
* var added = path.add(new Segment(point, handleIn, handleOut));
|
||||
*
|
||||
*
|
||||
* // Select the added segment, so we can see its handles:
|
||||
* added.selected = true;
|
||||
*
|
||||
*
|
||||
* path.add(new Point(170, 75));
|
||||
*/
|
||||
add: function(segment1 /*, segment2, ... */) {
|
||||
|
@ -358,35 +358,35 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Inserts one or more segments at a given index in the list of this path's
|
||||
* segments.
|
||||
*
|
||||
*
|
||||
* @param {Number} index the index at which to insert the segment.
|
||||
* @param {Segment|Point} segment the segment or point to be inserted.
|
||||
* @return {Segment} the added segment. This is not necessarily the same
|
||||
* object, e.g. if the segment to be added already belongs to another path.
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Inserting a segment:
|
||||
* var myPath = new Path();
|
||||
* myPath.strokeColor = 'black';
|
||||
* myPath.add(new Point(50, 75));
|
||||
* myPath.add(new Point(150, 75));
|
||||
*
|
||||
*
|
||||
* // Insert a new segment into myPath at index 1:
|
||||
* myPath.insert(1, new Point(100, 25));
|
||||
*
|
||||
*
|
||||
* // Select the segment which we just inserted:
|
||||
* myPath.segments[1].selected = true;
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Inserting multiple segments:
|
||||
* var myPath = new Path();
|
||||
* myPath.strokeColor = 'black';
|
||||
* myPath.add(new Point(50, 75));
|
||||
* myPath.add(new Point(150, 75));
|
||||
*
|
||||
*
|
||||
* // Insert two segments into myPath at index 1:
|
||||
* myPath.insert(1, [80, 25], [120, 25]);
|
||||
*
|
||||
*
|
||||
* // Select the segments which we just inserted:
|
||||
* myPath.segments[1].selected = true;
|
||||
* myPath.segments[2].selected = true;
|
||||
|
@ -413,39 +413,39 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Adds an array of segments (or types that can be converted to segments)
|
||||
* to the end of the {@link #segments} array.
|
||||
*
|
||||
*
|
||||
* @param {Segment[]} segments
|
||||
* @return {Segment[]} an array of the added segments. These segments are
|
||||
* not necessarily the same objects, e.g. if the segment to be added already
|
||||
* belongs to another path.
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Adding an array of Point objects:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* var points = [new Point(30, 50), new Point(170, 50)];
|
||||
* path.addSegments(points);
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Adding an array of [x, y] arrays:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* var array = [[30, 75], [100, 20], [170, 75]];
|
||||
* path.addSegments(array);
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Adding segments from one path to another:
|
||||
*
|
||||
*
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.addSegments([[30, 75], [100, 20], [170, 75]]);
|
||||
*
|
||||
*
|
||||
* var path2 = new Path();
|
||||
* path2.strokeColor = 'red';
|
||||
*
|
||||
*
|
||||
* // Add the second and third segments of path to path2:
|
||||
* path2.add(path.segments[1], path.segments[2]);
|
||||
*
|
||||
*
|
||||
* // Move path2 30pt to the right:
|
||||
* path2.position.x += 30;
|
||||
*/
|
||||
|
@ -457,7 +457,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Inserts an array of segments at a given index in the path's
|
||||
* {@link #segments} array.
|
||||
*
|
||||
*
|
||||
* @param {Number} index the index at which to insert the segments.
|
||||
* @param {Segment[]} segments the segments to be inserted.
|
||||
* @return {Segment[]} an array of the added segments. These segments are
|
||||
|
@ -472,21 +472,21 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Removes the segment at the specified index of the path's
|
||||
* {@link #segments} array.
|
||||
*
|
||||
*
|
||||
* @param {Number} index the index of the segment to be removed
|
||||
* @return {Segment} the removed segment
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Removing a segment from a path:
|
||||
*
|
||||
*
|
||||
* // Create a circle shaped path at { x: 80, y: 50 }
|
||||
* // with a radius of 35:
|
||||
* var path = new Path.Circle(new Point(80, 50), 35);
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Remove its second segment:
|
||||
* path.removeSegment(1);
|
||||
*
|
||||
*
|
||||
* // Select the path, so we can see its segments:
|
||||
* path.selected = true;
|
||||
*/
|
||||
|
@ -498,7 +498,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
// PORT: Add to Scriptographer
|
||||
/**
|
||||
* Removes all segments from the path's {@link #segments} array.
|
||||
*
|
||||
*
|
||||
* @name Path#removeSegments
|
||||
* @function
|
||||
* @return {Segment[]} an array containing the removed segments
|
||||
|
@ -506,22 +506,22 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Removes the segments from the specified {@code from} index to the
|
||||
* {@code to} index from the path's {@link #segments} array.
|
||||
*
|
||||
*
|
||||
* @param {Number} from the beginning index, inclusive
|
||||
* @param {Number} [to=segments.length] the ending index, exclusive
|
||||
* @return {Segment[]} an array containing the removed segments
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Removing segments from a path:
|
||||
*
|
||||
*
|
||||
* // Create a circle shaped path at { x: 80, y: 50 }
|
||||
* // with a radius of 35:
|
||||
* var path = new Path.Circle(new Point(80, 50), 35);
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Remove the segments from index 1 till index 2:
|
||||
* path.removeSegments(1, 2);
|
||||
*
|
||||
*
|
||||
* // Select the path, so we can see its segments:
|
||||
* path.selected = true;
|
||||
*/
|
||||
|
@ -568,59 +568,59 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
* Specifies whether an path is selected and will also return {@code true}
|
||||
* if the path is partially selected, i.e. one or more of its segments is
|
||||
* selected.
|
||||
*
|
||||
*
|
||||
* Paper.js draws the visual outlines of selected items on top of your
|
||||
* project. This can be useful for debugging, as it allows you to see the
|
||||
* construction of paths, position of path curves, individual segment points
|
||||
* and bounding boxes of symbol and raster items.
|
||||
*
|
||||
*
|
||||
* @type Boolean
|
||||
* @bean
|
||||
* @see Project#selectedItems
|
||||
* @see Segment#selected
|
||||
* @see Point#selected
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Selecting an item:
|
||||
* var path = new Path.Circle(new Size(80, 50), 35);
|
||||
* path.selected = true; // Select the path
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // A path is selected, if one or more of its segments is selected:
|
||||
* var path = new Path.Circle(new Size(80, 50), 35);
|
||||
*
|
||||
*
|
||||
* // Select the second segment of the path:
|
||||
* path.segments[1].selected = true;
|
||||
*
|
||||
*
|
||||
* // If the path is selected (which it is), set its fill color to red:
|
||||
* if (path.selected) {
|
||||
* path.fillColor = 'red';
|
||||
* }
|
||||
*
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* Specifies whether the path and all its segments are selected.
|
||||
*
|
||||
*
|
||||
* @type Boolean
|
||||
* @bean
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // A path is fully selected, if all of its segments are selected:
|
||||
* var path = new Path.Circle(new Size(80, 50), 35);
|
||||
* path.fullySelected = true;
|
||||
*
|
||||
*
|
||||
* var path2 = new Path.Circle(new Size(180, 50), 35);
|
||||
* path2.fullySelected = true;
|
||||
*
|
||||
*
|
||||
* // Deselect the second segment of the second path:
|
||||
* path2.segments[1].selected = false;
|
||||
*
|
||||
*
|
||||
* // If the path is fully selected (which it is),
|
||||
* // set its fill color to red:
|
||||
* if (path.fullySelected) {
|
||||
* path.fillColor = 'red';
|
||||
* }
|
||||
*
|
||||
*
|
||||
* // If the second path is fully selected (which it isn't, since we just
|
||||
* // deselected its second segment),
|
||||
* // set its fill color to red:
|
||||
|
@ -657,26 +657,26 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
* Converts the curves in a path to straight lines with an even distribution
|
||||
* of points. The distance between the produced segments is as close as
|
||||
* possible to the value specified by the {@code maxDistance} parameter.
|
||||
*
|
||||
*
|
||||
* @param {Number} maxDistance the maximum distance between the points
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Flattening a circle shaped path:
|
||||
*
|
||||
*
|
||||
* // Create a circle shaped path at { x: 80, y: 50 }
|
||||
* // with a radius of 35:
|
||||
* var path = new Path.Circle(new Size(80, 50), 35);
|
||||
*
|
||||
*
|
||||
* // Select the path, so we can inspect its segments:
|
||||
* path.selected = true;
|
||||
*
|
||||
*
|
||||
* // Create a copy of the path and move it 150 points to the right:
|
||||
* var copy = path.clone();
|
||||
* copy.position.x += 150;
|
||||
*
|
||||
*
|
||||
* // Convert its curves to points, with a max distance of 20:
|
||||
* copy.flatten(20);
|
||||
*
|
||||
*
|
||||
* // Select the copy, so we can inspect its segments:
|
||||
* copy.selected = true;
|
||||
*/
|
||||
|
@ -700,20 +700,20 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
* Smooths a path by simplifying it. The {@link Path#segments} array is
|
||||
* analyzed and replaced by a more optimal set of segments, reducing memory
|
||||
* usage and speeding up drawing.
|
||||
*
|
||||
*
|
||||
* @param {Number} [tolerance=2.5]
|
||||
*
|
||||
*
|
||||
* @example {@paperscript height=300}
|
||||
* // Click and drag below to draw to draw a line, when you release the
|
||||
* // mouse, the is made smooth using path.simplify():
|
||||
*
|
||||
*
|
||||
* var path;
|
||||
* function onMouseDown(event) {
|
||||
* // If we already made a path before, deselect it:
|
||||
* if (path) {
|
||||
* path.selected = false;
|
||||
* }
|
||||
*
|
||||
*
|
||||
* // Create a new path and add the position of the mouse
|
||||
* // as its first segment. Select it, so we can see the
|
||||
* // segment points:
|
||||
|
@ -722,13 +722,13 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
* path.add(event.point);
|
||||
* path.selected = true;
|
||||
* }
|
||||
*
|
||||
*
|
||||
* function onMouseDrag(event) {
|
||||
* // On every drag event, add a segment to the path
|
||||
* // at the position of the mouse:
|
||||
* path.add(event.point);
|
||||
* }
|
||||
*
|
||||
*
|
||||
* function onMouseUp(event) {
|
||||
* // When the mouse is released, simplify the path:
|
||||
* path.simplify();
|
||||
|
@ -747,7 +747,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* Specifies whether the path is oriented clock-wise.
|
||||
*
|
||||
*
|
||||
* @type Boolean
|
||||
* @bean
|
||||
*/
|
||||
|
@ -814,53 +814,53 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Joins the path with the specified path, which will be removed in the
|
||||
* process.
|
||||
*
|
||||
*
|
||||
* @param {Path} path
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Joining two paths:
|
||||
* var path = new Path([30, 25], [30, 75]);
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* var path2 = new Path([200, 25], [200, 75]);
|
||||
* path2.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Join the paths:
|
||||
* path.join(path2);
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Joining two paths that share a point at the start or end of their
|
||||
* // segments array:
|
||||
* var path = new Path([30, 25], [30, 75]);
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* var path2 = new Path([30, 25], [80, 25]);
|
||||
* path2.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Join the paths:
|
||||
* path.join(path2);
|
||||
*
|
||||
*
|
||||
* // After joining, path with have 3 segments, since it
|
||||
* // shared its first segment point with the first
|
||||
* // segment point of path2.
|
||||
*
|
||||
*
|
||||
* // Select the path to show that they have joined:
|
||||
* path.selected = true;
|
||||
*
|
||||
*
|
||||
* @example {@paperscript}
|
||||
* // Joining two paths that connect at two points:
|
||||
* var path = new Path([30, 25], [80, 25], [80, 75]);
|
||||
* path.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* var path2 = new Path([30, 25], [30, 75], [80, 75]);
|
||||
* path2.strokeColor = 'black';
|
||||
*
|
||||
*
|
||||
* // Join the paths:
|
||||
* path.join(path2);
|
||||
*
|
||||
*
|
||||
* // Because the paths were joined at two points, the path is closed
|
||||
* // and has 4 segments.
|
||||
*
|
||||
*
|
||||
* // Select the path to show that they have joined:
|
||||
* path.selected = true;
|
||||
*/
|
||||
|
@ -905,7 +905,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* The length of the perimeter of the path.
|
||||
*
|
||||
*
|
||||
* @type Number
|
||||
* @bean
|
||||
*/
|
||||
|
@ -937,7 +937,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
// DOCS: document Path#getLocationAt
|
||||
/**
|
||||
* {@grouptitle Positions on Paths and Curves}
|
||||
*
|
||||
*
|
||||
* @param {Number} offset
|
||||
* @param {Boolean} [isParameter=false]
|
||||
* @return {CurveLocation}
|
||||
|
@ -971,48 +971,48 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
// DOCS: improve Path#getPointAt documenation.
|
||||
/**
|
||||
* Get the point on the path at the given offset.
|
||||
*
|
||||
*
|
||||
* @param {Number} offset
|
||||
* @param {Boolean} [isParameter=false]
|
||||
* @return {Point} the point at the given offset
|
||||
*
|
||||
*
|
||||
* @example {@paperscript height=150}
|
||||
* // Finding the point on a path at a given offset:
|
||||
*
|
||||
*
|
||||
* // Create an arc shaped path:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.add(new Point(40, 100));
|
||||
* path.arcTo(new Point(150, 100));
|
||||
*
|
||||
*
|
||||
* // We're going to be working with a third of the length
|
||||
* // of the path as the offset:
|
||||
* var offset = path.length / 3;
|
||||
*
|
||||
*
|
||||
* // Find the point on the path:
|
||||
* var point = path.getPointAt(offset);
|
||||
*
|
||||
*
|
||||
* // Create a small circle shaped path at the point:
|
||||
* var circle = new Path.Circle(point, 3);
|
||||
* circle.fillColor = 'red';
|
||||
*
|
||||
*
|
||||
* @example {@paperscript height=150}
|
||||
* // Iterating over the length of a path:
|
||||
*
|
||||
*
|
||||
* // Create an arc shaped path:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.add(new Point(40, 100));
|
||||
* path.arcTo(new Point(150, 100));
|
||||
*
|
||||
*
|
||||
* var amount = 5;
|
||||
* var length = path.length;
|
||||
* for (var i = 0; i < amount + 1; i++) {
|
||||
* var offset = i / amount * length;
|
||||
*
|
||||
*
|
||||
* // Find the point on the path at the given offset:
|
||||
* var point = path.getPointAt(offset);
|
||||
*
|
||||
*
|
||||
* // Create a small circle shaped path at the point:
|
||||
* var circle = new Path.Circle(point, 3);
|
||||
* circle.fillColor = 'red';
|
||||
|
@ -1026,61 +1026,61 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Get the tangent to the path at the given offset as a vector
|
||||
* point.
|
||||
*
|
||||
*
|
||||
* @param {Number} offset
|
||||
* @param {Boolean} [isParameter=false]
|
||||
* @return {Point} the tangent vector at the given offset
|
||||
*
|
||||
*
|
||||
* @example {@paperscript height=150}
|
||||
* // Working with the tangent vector at a given offset:
|
||||
*
|
||||
*
|
||||
* // Create an arc shaped path:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.add(new Point(40, 100));
|
||||
* path.arcTo(new Point(150, 100));
|
||||
*
|
||||
*
|
||||
* // We're going to be working with a third of the length
|
||||
* // of the path as the offset:
|
||||
* var offset = path.length / 3;
|
||||
*
|
||||
*
|
||||
* // Find the point on the path:
|
||||
* var point = path.getPointAt(offset);
|
||||
*
|
||||
*
|
||||
* // Find the tangent vector at the given offset:
|
||||
* var tangent = path.getTangentAt(offset);
|
||||
*
|
||||
*
|
||||
* // Make the tangent vector 60pt long:
|
||||
* tangent.length = 60;
|
||||
*
|
||||
*
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'red';
|
||||
* path.add(point);
|
||||
* path.add(point + tangent);
|
||||
*
|
||||
*
|
||||
* @example {@paperscript height=200}
|
||||
* // Iterating over the length of a path:
|
||||
*
|
||||
*
|
||||
* // Create an arc shaped path:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.add(new Point(40, 100));
|
||||
* path.arcTo(new Point(150, 100));
|
||||
*
|
||||
*
|
||||
* var amount = 6;
|
||||
* var length = path.length;
|
||||
* for (var i = 0; i < amount + 1; i++) {
|
||||
* var offset = i / amount * length;
|
||||
*
|
||||
*
|
||||
* // Find the point on the path at the given offset:
|
||||
* var point = path.getPointAt(offset);
|
||||
*
|
||||
*
|
||||
* // Find the normal vector on the path at the given offset:
|
||||
* var tangent = path.getTangentAt(offset);
|
||||
*
|
||||
*
|
||||
* // Make the tangent vector 60pt long:
|
||||
* tangent.length = 60;
|
||||
*
|
||||
*
|
||||
* var line = new Path();
|
||||
* line.strokeColor = 'red';
|
||||
* line.add(point);
|
||||
|
@ -1094,61 +1094,61 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
|
||||
/**
|
||||
* Get the normal to the path at the given offset as a vector point.
|
||||
*
|
||||
*
|
||||
* @param {Number} offset
|
||||
* @param {Boolean} [isParameter=false]
|
||||
* @return {Point} the normal vector at the given offset
|
||||
*
|
||||
*
|
||||
* @example {@paperscript height=150}
|
||||
* // Working with the normal vector at a given offset:
|
||||
*
|
||||
*
|
||||
* // Create an arc shaped path:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.add(new Point(40, 100));
|
||||
* path.arcTo(new Point(150, 100));
|
||||
*
|
||||
*
|
||||
* // We're going to be working with a third of the length
|
||||
* // of the path as the offset:
|
||||
* var offset = path.length / 3;
|
||||
*
|
||||
*
|
||||
* // Find the point on the path:
|
||||
* var point = path.getPointAt(offset);
|
||||
*
|
||||
*
|
||||
* // Find the normal vector at the given offset:
|
||||
* var normal = path.getNormalAt(offset);
|
||||
*
|
||||
*
|
||||
* // Make the normal vector 30pt long:
|
||||
* normal.length = 30;
|
||||
*
|
||||
*
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'red';
|
||||
* path.add(point);
|
||||
* path.add(point + normal);
|
||||
*
|
||||
*
|
||||
* @example {@paperscript height=200}
|
||||
* // Iterating over the length of a path:
|
||||
*
|
||||
*
|
||||
* // Create an arc shaped path:
|
||||
* var path = new Path();
|
||||
* path.strokeColor = 'black';
|
||||
* path.add(new Point(40, 100));
|
||||
* path.arcTo(new Point(150, 100));
|
||||
*
|
||||
*
|
||||
* var amount = 10;
|
||||
* var length = path.length;
|
||||
* for (var i = 0; i < amount + 1; i++) {
|
||||
* var offset = i / amount * length;
|
||||
*
|
||||
*
|
||||
* // Find the point on the path at the given offset:
|
||||
* var point = path.getPointAt(offset);
|
||||
*
|
||||
*
|
||||
* // Find the normal vector on the path at the given offset:
|
||||
* var normal = path.getNormalAt(offset);
|
||||
*
|
||||
*
|
||||
* // Make the normal vector 30pt long:
|
||||
* normal.length = 30;
|
||||
*
|
||||
*
|
||||
* var line = new Path();
|
||||
* line.strokeColor = 'red';
|
||||
* line.add(point);
|
||||
|
@ -1311,7 +1311,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
/**
|
||||
* Solves a tri-diagonal system for one of coordinates (x or y) of first
|
||||
* bezier control points.
|
||||
*
|
||||
*
|
||||
* @param rhs right hand side vector.
|
||||
* @return Solution vector.
|
||||
*/
|
||||
|
@ -1775,7 +1775,7 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
|
|||
*/
|
||||
getBounds: function(/* matrix */) {
|
||||
var useCache = arguments.length == 0;
|
||||
// Pass the matrix hidden from Bootstrap, so it still inject
|
||||
// Pass the matrix hidden from Bootstrap, so it still inject
|
||||
// getBounds as bean too.
|
||||
if (!useCache || !this._bounds) {
|
||||
var bounds = this._createBounds(getBounds(this, arguments[0]));
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue