※現在、「wonderfl build flash online」求人コンテンツ制作に関してのアンケートを実施中です！みなさまのお力添えを頂いて、続々とアンケート結果が集まっていますが、まだまだ募集しております。ご協力のほど、どうぞよろしくお願いいたします！

wonderfl運営事務局
→アンケートページ（※ログインしてからお答えいただけるようになっています。）

 notice: Flash editor updated! Join the development! Thanks to MiniBuilder


embed

noswf download fullscreen
flash swf thumbnail play
reload download fullscreen

FAVORITE BY
:
:
糸で文字
:
AnimationDrawing紐で文字が生成されてく。
:
text紐で文字。StringでString
:
SVG糸で文字を書く
:
effectsewing text effect
:
糸と文字
:
:
AnimationDrawing紐で文字が生成されてく。
:
:
:
:
:
:
:
motionlineamazing
:
:
Sewing
:
Sewing
:
:
cool
:
:
:
SVGWow, very interesting effect :)
:
:
:
:
textCool text effect
:
:
lineslines curves
:
wonderfl
:
:
:
:
糸で文字すげー
:
typoパクったら負け
:
sewingtextawesome!
:
lineimpressive
:
line
:
:
スンゲー
:
cool
:
どひゃー
:
糸で文字なにかのCMみたい
:
すごいとしか言いようがない
:
:
ひょろひょろ
:
:
びろびろびろびろ
:
:
うにょうにょ文字
:
これはすごい糸
:
糸
:
:
凄い
:
糸
:
:
さすが、Saqooshaさん。
:
すごすぎ
:
:
i just peed a little bit....
:
pas mal...
:
にゅるにゅるる
:
svgこれはすごい！コードの行数もすごい
:
なんじゃこりゃー
:
すごいー
:
きたーー
:
Amazing!!!!!!
:
素晴らしい！
:
かわえぇ
:
シュルシュルシュルー！
:
おもしろー
:
糸すごい
:
糸すご
:
FORKED
>sort

Sewing forked from: Sewing [diff(1)]

  1. // forked from Saqoosha's Sewing
  2. package {
  4. import caurina.transitions.Equations;
  5. import caurina.transitions.Tweener;
  6. import caurina.transitions.properties.CurveModifiers;
  8. import flash.display.Graphics;
  9. import flash.display.Sprite;
  10. import flash.display.StageAlign;
  11. import flash.display.StageQuality;
  12. import flash.display.StageScaleMode;
  13. import flash.events.Event;
  14. import flash.geom.Point;
  15. import flash.net.URLLoader;
  16. import flash.net.URLLoaderDataFormat;
  17. import flash.net.URLRequest;
  18. import flash.utils.setTimeout;
  20. [SWF(width=465, height=465, backgroundColor=0xffffff, frameRate=60)]
  22. public class Sewing extends Sprite {
  24. private var _loader:URLLoader;
  25. private var _canvas:Sprite;
  26. private var _paths:Array;
  28. public function Sewing() {
  29. Wonderfl.capture_delay(8);
  31. this.stage.quality = StageQuality.BEST;
  32. this.stage.align = StageAlign.TOP_LEFT;
  33. this.stage.scaleMode = StageScaleMode.NO_SCALE;
  35. CurveModifiers.init();
  37. this._canvas = this.addChild(new Sprite()) as Sprite;
  39. this._loader = new URLLoader();
  40. this._loader.dataFormat = URLLoaderDataFormat.TEXT;
  41. this._loader.addEventListener(Event.COMPLETE, this._handleLoaded);
  42. this._loader.load(new URLRequest('http://saqoosha.net/lab/wonderfl/saqoosha.svg'));
  43. }
  45. private function _handleLoaded(e:Event):void {
  46. var svg:XML = new XML(this._loader.data);
  47. this._paths = [];
  48. var path:SVGPath;
  49. var delay:Number = 2.0;
  50. var cx:Number = parseInt(svg.@width) / 2;
  51. var cy:Number = parseInt(svg.@height) / 2;
  52. this._canvas.x = this.stage.stageWidth / 2 - cx;
  53. this._canvas.y = this.stage.stageHeight / 2 - cy;
  54. for each (var pathNode:XML in svg..*::path) {
  55. path = new SVGPath(pathNode);
  56. this._paths.push(path);
  57. var i:Number = 0;
  58. var di:Number = Math.PI * 2 / path.points.length;
  59. var px:Number = cx;
  60. var py:Number = this.stage.stageHeight - this._canvas.y;
  61. for each (var pt:Point in path.points) {
  62. Tweener.addTween(pt, {
  63. x: pt.x,
  64. y: pt.y,
  65. _bezier:[
  66. { x:cx + Math.sin(delay * 1.3) * 300 + Math.sin(delay * 10.3) * 80, y:50 },
  67. { x:100 - Math.sin(delay * 7.2) * 80, y:50 }
  68. ],
  69. time: 1.0,
  70. delay: delay,
  71. transition: Equations.easeNone
  72. });
  73. pt.x = px;
  74. pt.y = py;
  75. delay += 0.004;
  76. i += di;
  77. }
  78. }
  79. this.addEventListener(Event.ENTER_FRAME, this._drawPaths);
  80. setTimeout(function ():void {
  81. removeEventListener(Event.ENTER_FRAME, _drawPaths);
  82. }, (delay + 1) * 1000);
  83. }
  85. private function _drawPaths(e:Event):void {
  86. this._canvas.graphics.clear();
  87. for each (var path:SVGPath in this._paths) {
  88. path.draw(this._canvas.graphics);
  89. }
  90. }
  91. }
  92. }
  108. import flash.display.Graphics;
  109. import flash.geom.Point;
  110. import flash.geom.Rectangle;
  113. /**
  114. * @class PathToArray
  115. * @author Helen Triolo (with contributions from many people)
  116. * @version 1.01
  117. * @description Takes as input an SVG Path node (eg, from Illustrator 10, SVG Factory, etc, but must
  118. * not contain any CRLF characters), and an empty array.
  119. * Parses the path node to make an array of drawing commands, which include cubic bezier
  120. * draw commands. Converts the cubic beziers to an array of equivalent quad beziers,
  121. * using Robert Penner's code to convert with accuracy within 1 pixel.
  122. * Drawing commands are produced in the format originally devised by Peter Hall
  123. * in his ASVDrawing class. These are the possible elements in array dCmds (and the
  124. * corresponding Flash drawing API commands to apply them):
  125. * ['M',[x,y]] moveTo(x,y)
  126. * ['L',[x,y]] lineTo(x,y)
  127. * ['C',[cx,cy,ax,ay]] moveTo(cx,cy,ax,ay)
  128. * ['S',[width,color,alpha]] lineStyle(widtb,color,alpha)
  129. * ['F',[color,alpha]] beginFill(color,alpha)
  130. * ['EF'] endFill()
  131. * History:
  132. * v1.00 2005/11/13 Original release
  133. * v1.01 2006/05/06 Stroke corrected to stroke, line 250 (thanks Gábor Szabó)
  134. *
  135. * @param svgnode (XMLNode) Path node from SVG file
  136. * @param dCmds (Array) Empty array to write commands to
  137. */
  139. class SVGPath {
  141. private var _commands:Array;
  142. public function get commands():Array { return this._commands }
  144. private var _points:Array;
  145. public function get points():Array { return this._points }
  146. private function addPoint(... points:Array):void {
  147. for each (var pt:Point in points) {
  148. this._addPoint(pt);
  149. }
  150. }
  151. private function _addPoint(pt:Point):void {
  152. if (pt.x < this._bounds.left) {
  153. this._bounds.left = pt.x;
  154. } else if (this._bounds.right < pt.x) {
  155. this._bounds.right = pt.x;
  156. }
  157. if (pt.y < this._bounds.top) {
  158. this._bounds.top = pt.y;
  159. } else if (this._bounds.bottom < pt.y) {
  160. this._bounds.bottom = pt.y;
  161. }
  162. this._points.push(pt);
  163. }
  165. private var _bounds:Rectangle;
  166. public function get boundsRect():Rectangle { return this._bounds }
  168. private var _hasFill:Boolean;
  169. public function get hasFill():Boolean { return this._hasFill }
  171. private var _hasStroke:Boolean;
  172. public function get hasStroke():Boolean { return this._hasStroke }
  174. public function swapFillAndStroke():void {
  175. var flg:Boolean = this._hasFill;
  176. this._hasFill = this._hasStroke;
  177. this._hasStroke = flg;
  179. var val:Number = this._fillColor;
  180. this._fillColor = this._strokeColor;
  181. this._strokeColor = val;
  183. val = this._fillAlpha;
  184. this._fillAlpha = this._strokeAlpha;
  185. this._strokeAlpha = val;
  186. }
  188. private var _fillColor:Number;
  189. public function get fillColor():Number { return this._fillColor }
  190. public function set fillColor(col:Number):void { this._fillColor = col }
  192. private var _fillAlpha:Number;
  193. public function get fillAlpha():Number { return this._fillAlpha }
  194. public function set fillAlpha(al:Number):void { this._fillAlpha = al }
  196. private var _strokeColor:Number;
  197. public function get strokeColor():Number { return this._strokeColor }
  198. public function set strokeColor(col:Number):void { this._strokeColor = col }
  200. private var _strokeAlpha:Number;
  201. public function get strokeAlpha():Number { return this._strokeAlpha }
  202. public function set strokeAlpha(al:Number):void { this._strokeAlpha = al }
  204. private var _strokeWidth:Number;
  205. public function get strokeWidth():Number { return this._strokeWidth }
  206. public function set strokeWidth(wd:Number):void { this._strokeWidth = wd }
  208. /**
  209. *
  210. */
  211. public function SVGPath(svgNode:XML) {
  212. this._commands = [];
  213. this._points = [];
  214. this._bounds = new Rectangle();
  215. this._bounds.top = this._bounds.left = Number.MAX_VALUE;
  216. this._bounds.bottom = this._bounds.right = Number.MIN_VALUE;
  217. this._hasFill = false;
  218. this._hasStroke = false;
  220. this.makeDrawCmds(this.extractCmds(svgNode));
  221. }
  223. /**
  224. * @method extractCmds ()
  225. * @param node (XMLNode) SVG path node
  226. * @description Parse path node and convert to array of SVG drawing commands and data
  227. * eg, M,250.8,33.8,c,-33.6,-9.7,-42,19.1,-48.2,22.6,s,-27.9,2.2,-33.3,5.8,
  228. * c,-5.3,3.5,-17.3,23.5,-8.4,41.6
  229. * @returns (Array) array of drawing commands
  230. */
  231. private function extractCmds(node:XML):Array {
  232. var i:Number;
  233. var startColor:Number;
  234. var thisColor:Number;
  236. //var hasFill:Boolean = false;
  237. var hasTransform:Boolean = false;
  238. //var hasStroke:Boolean = false;
  239. var hasStrokeWidth:Boolean = false;
  240. var hasRotate:Number = 0;
  241. var dstring:String = "";
  242. var rotation:Number;
  244. // is there a fill attribute, a transform attribute, a stroke attribute?
  245. for each (var a:XML in node.attributes()) {
  246. switch (a.name().toString()) {
  247. case 'fill': this._hasFill = true; break;
  248. case 'transform': hasTransform = true; break;
  249. case 'stroke': this._hasStroke = true; break;
  250. case 'stroke-width': hasStrokeWidth = true; break;
  251. }
  252. }
  253. if (this._hasFill) {
  254. // parse for fill color specification
  255. // if a hex number is specified, startColor will be > 0
  256. // if a color name is specified, startColor will be 0
  257. var fillStr:String = node.@fill;
  258. if (fillStr == 'none') {
  259. this._hasFill = false;
  260. } else {
  261. startColor = fillStr.indexOf("#") + 1;
  262. if (startColor == 0) { // name specified instead of color number
  263. thisColor = SVGColor.getByName(fillStr);
  264. if (isNaN(thisColor)) {
  265. this._hasFill = false;
  266. } else {
  267. this._fillColor = thisColor;
  268. this._fillAlpha = 1.0;
  269. }
  270. } else {
  271. this._fillColor = parseInt(fillStr.substr(startColor, 6), 16);
  272. this._fillAlpha = 1.0;
  273. }
  274. }
  275. }
  277. // stroke: color, width, alpha
  278. if (this._hasStroke) {
  279. // parse for stroke color specification
  280. var strokeStr:String = node.@stroke;
  281. if (strokeStr == 'none') {
  282. this._hasStroke = false;
  283. } else {
  284. startColor = strokeStr.indexOf("#")+1;
  285. if (startColor == 0) { // name specified instead of color number
  286. thisColor = SVGColor.getByName(strokeStr);
  287. if (isNaN(thisColor)) {
  288. this._hasStroke = false;
  289. } else {
  290. this._strokeWidth = 0;
  291. this._strokeColor = SVGColor.getByName(strokeStr);
  292. this._strokeAlpha = 1.0;
  293. }
  294. } else {
  295. this._strokeWidth = 0;
  296. this._strokeColor = parseInt(strokeStr.substr(startColor,6),16);
  297. this._strokeAlpha = 1.0;
  298. }
  299. }
  300. }
  302. if (hasStrokeWidth) this._strokeWidth = Number(node.attribute("stroke-width"));
  304. // if stroke and fill are both undefined, set fill to black
  305. if (!this._hasFill && !this._hasStroke) {
  306. this._hasFill = true;
  307. this._fillColor = 0;
  308. this._fillAlpha = 1.0;
  309. }
  311. if (hasTransform) {
  312. // parse for rotation specification
  313. var transformStr:String = node.@transform;
  314. hasRotate = transformStr.indexOf("rotate");
  315. if (hasRotate > -1) {
  316. var startRotate:Number = transformStr.indexOf("(");
  317. var endRotate:Number = transformStr.indexOf(")");
  318. rotation = parseInt(transformStr.substr(startRotate+1, endRotate-startRotate));
  319. } else {
  320. rotation = 0;
  321. }
  323. } else rotation = 0;
  325. // if commas included, is it Adobe Illustrator (no spaces) or SVG Factory/other?
  326. dstring = node.@d;
  327. if (dstring.indexOf(",") > -1) { // has commas?
  328. if (dstring.indexOf(" ") > -1) { // yes, has spaces?
  329. // change spaces to commas, then deal as for Illustrator
  330. dstring = String2.replace(dstring," ",",");
  331. }
  332. } else { // no commas
  333. // get rid of extra spaces and change rest to commas
  334. dstring = String2.shrinkSequencesOf(dstring, " ");
  335. dstring = String2.replace(dstring, " ",",");
  336. }
  337. dstring = String2.replace(dstring, "c",",c,");
  338. dstring = String2.replace(dstring, "C",",C,");
  339. dstring = String2.replace(dstring, "S",",S,");
  340. dstring = String2.replace(dstring, "s",",s,");
  341. // separate the z from the last element
  342. dstring = String2.replace(dstring, "z",",z");
  343. // change the following if M can be mid-path
  344. dstring = String2.replace(dstring, "M","M,");
  345. dstring = String2.replace(dstring, "L",",L,");
  346. dstring = String2.replace(dstring, "l",",l,");
  347. dstring = String2.replace(dstring, "H",",H,");
  348. dstring = String2.replace(dstring, "h",",h,");
  349. dstring = String2.replace(dstring, "V",",V,");
  350. dstring = String2.replace(dstring, "v",",v,");
  351. dstring = String2.replace(dstring, "Q",",Q,");
  352. dstring = String2.replace(dstring, "q",",q,");
  353. dstring = String2.replace(dstring, "T",",T,");
  354. dstring = String2.replace(dstring, "t",",t,");
  355. // Adobe includes no delimiter before negative numbers
  356. dstring = String2.replace(dstring, "-",",-");
  357. // get rid of any dup commas we might have introduced
  358. dstring = String2.replace(dstring, ",,",",");
  359. // get rid of spaces
  360. // (cr/lf's have to be removed before the xml object can be created,
  361. // so that is done in xml.onData method)
  362. dstring = String2.replace(dstring, " ","");
  363. dstring = String2.replace(dstring, "\t","");
  365. return dstring.split(",");
  366. }
  368. /**
  369. * @method makeDrawCmds
  370. * @param svgCmds (Array) array of svg draw commands (as output from extractCmds)
  371. * @description Convert svg draw commands to array of ASVDrawing commands: _commands
  372. */
  373. private function makeDrawCmds(svgCmds:Array):void {
  374. var j:Number = 0, ii:int;
  375. var qc:Array;
  376. var firstP:Point;
  377. var lastP:Point;
  378. var lastC:Point;
  379. var cmd:String;
  380. var cp:Point, pp:Point;
  382. do {
  383. cmd = svgCmds[j++];
  384. switch (cmd) {
  385. case "M" :
  386. // moveTo point
  387. firstP = lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  388. if (this._hasFill) {
  389. _commands.push(new BeginFillCommand(this._fillColor, this._fillAlpha));
  390. }
  391. if (this._hasStroke) {
  392. _commands.push(new LineStyleCommand(this._strokeWidth, this._strokeColor, this._strokeAlpha));
  393. }
  394. _commands.push(new MoveToCommand(firstP));
  395. this.addPoint(firstP);
  396. j += 2;
  397. if (j < svgCmds.length && !isNaN(Number(svgCmds[j]))) {
  398. do {
  399. // if multiple points listed, add the rest as lineTo points
  400. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  401. _commands.push(new LineToCommand(lastP));
  402. this.addPoint(lastP);
  403. firstP = lastP;
  404. j += 2;
  405. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  406. }
  407. break;
  409. case "l" :
  410. do {
  411. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  412. _commands.push(new LineToCommand(lastP));
  413. this.addPoint(lastP);
  414. firstP = lastP;
  415. j += 2;
  416. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  417. break;
  419. case "L" :
  420. do {
  421. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  422. _commands.push(new LineToCommand(lastP));
  423. this.addPoint(lastP);
  424. firstP = lastP;
  425. j += 2;
  426. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  427. break;
  429. case "h" :
  430. do {
  431. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y);
  432. _commands.push(new LineToCommand(lastP));
  433. this.addPoint(lastP);
  434. firstP = lastP;
  435. j += 1;
  436. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  437. break;
  439. case "H" :
  440. do {
  441. lastP = new Point(Number(svgCmds[j]), lastP.y);
  442. _commands.push(new LineToCommand(lastP));
  443. this.addPoint(lastP);
  444. firstP = lastP;
  445. j += 1;
  446. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  447. break;
  449. case "v" :
  450. do {
  451. lastP = new Point(lastP.x, lastP.y+Number(svgCmds[j]));
  452. _commands.push(new LineToCommand(lastP));
  453. this.addPoint(lastP);
  454. firstP = lastP;
  455. j += 1;
  456. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  457. break;
  459. case "V" :
  460. do {
  461. lastP = new Point(lastP.x, Number(svgCmds[j]));
  462. _commands.push(new LineToCommand(lastP));
  463. this.addPoint(lastP);
  464. firstP = lastP;
  465. j += 1;
  466. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  467. break;
  469. case "q" :
  470. do {
  471. // control is relative to lastP, not lastC
  472. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  473. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  474. _commands.push(new CurveToCommand(lastC, lastP));
  475. this.addPoint(lastC, lastP);
  476. firstP = lastP;
  477. j += 4;
  478. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  479. break;
  481. case "Q" :
  482. do {
  483. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  484. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  485. _commands.push(new CurveToCommand(lastC, lastP));
  486. this.addPoint(lastC, lastP);
  487. firstP = lastP;
  488. j += 4;
  489. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  490. break;
  492. case "c" :
  493. do {
  494. // don't save if c1.x=c1.y=c2.x=c2.y=0
  495. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  496. } else {
  497. qc = [];
  498. Math2.getQuadBez_RP(
  499. {x:lastP.x, y:lastP.y},
  500. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  501. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  502. {x:lastP.x+Number(svgCmds[j+4]), y:lastP.y+Number(svgCmds[j+5])},
  503. 1, qc);
  504. for (ii=0; ii
  505. cp = new Point(qc[ii].cx, qc[ii].cy);
  506. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  507. _commands.push(new CurveToCommand(cp, pp));
  508. this.addPoint(cp, pp);
  509. }
  510. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  511. lastP = new Point(lastP.x+Number(svgCmds[j+4]), lastP.y+Number(svgCmds[j+5]));
  512. this.addPoint(lastC, lastP);
  513. firstP = lastP;
  514. }
  515. j += 6;
  516. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  517. break;
  519. case "C" :
  520. do {
  521. // don't save if c1.x=c1.y=c2.x=c2.y=0
  522. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  523. } else {
  524. qc = [];
  525. Math2.getQuadBez_RP(
  526. {x:firstP.x, y:firstP.y},
  527. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  528. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  529. {x:Number(svgCmds[j+4]), y:Number(svgCmds[j+5])},
  530. 1, qc);
  531. for (ii=0; ii
  532. cp = new Point(qc[ii].cx, qc[ii].cy);
  533. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  534. _commands.push(new CurveToCommand(cp, pp));
  535. this.addPoint(cp, pp);
  536. }
  537. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  538. lastP = new Point(Number(svgCmds[j+4]), Number(svgCmds[j+5]));
  539. this.addPoint(lastC, lastP);
  540. firstP = lastP;
  541. }
  542. j += 6;
  543. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  544. break;
  546. case "s" :
  547. do {
  548. // don't save if c1.x=c1.y=c2.x=c2.y=0
  549. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  550. } else {
  551. qc = [];
  552. Math2.getQuadBez_RP(
  553. {x:firstP.x, y:firstP.y},
  554. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  555. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  556. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  557. 1, qc);
  558. for (ii=0; ii
  559. cp = new Point(qc[ii].cx, qc[ii].cy);
  560. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  561. _commands.push(new CurveToCommand(cp, pp));
  562. this.addPoint(cp, pp);
  563. }
  564. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  565. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  566. this.addPoint(lastC, lastP);
  567. firstP = lastP;
  568. }
  569. j += 4;
  570. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  571. break;
  573. case "S" :
  574. do {
  575. // don't save if c1.x=c1.y=c2.x=c2.y=0
  576. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  577. } else {
  578. qc = [];
  579. Math2.getQuadBez_RP(
  580. {x:firstP.x, y:firstP.y},
  581. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  582. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  583. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  584. 1, qc);
  585. for (ii=0; ii
  586. cp = new Point(qc[ii].cx, qc[ii].cy);
  587. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  588. _commands.push(new CurveToCommand(cp, pp));
  589. this.addPoint(cp, pp);
  590. }
  591. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  592. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  593. this.addPoint(lastC, lastP);
  594. firstP = lastP;
  595. }
  596. j += 4;
  597. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  598. break;
  600. case "z" :
  601. case "Z" :
  602. if (!firstP.equals(lastP)) {
  603. _commands.push(new LineToCommand(firstP));
  604. this.addPoint(firstP);
  605. }
  606. j++;
  607. break;
  609. } // end switch
  610. } while (j < svgCmds.length);
  611. }
  613. /**
  614. *
  615. */
  616. public function draw(graphics:Graphics):void {
  617. for each (var command:SVGPathCommand in this._commands) {
  618. command.execute(graphics);
  619. }
  620. }
  622. }
  626. class String2 {
  628. /**
  629. * @class String2
  630. * @author Helen Triolo, with inclusions from Tim Groleau
  631. * @description String functions not included in String needed for path->array conversion
  632. */
  634. /**
  635. * @method replace ()
  636. * @description Replaces sFind in s with sReplace
  637. * @param s (String) original string
  638. * @param sFind (String) part to be replaced
  639. * @param sReplace (String) string to replace it with
  640. * @returns (String) string with replacement
  641. */
  642. public static function replace(s:String, sFind:String, sReplace:String):String {
  643. return s.split(sFind).join(sReplace);
  644. }
  646. /**
  647. * @method shrinkSequencesOf (Groleau)
  648. * @description Shrinks all sequences of a given character in a string to one
  649. * @param s (String) original string
  650. * @param ch (String) character to be found
  651. * @returns (String) string with sequences shrunk
  652. */
  653. public static function shrinkSequencesOf(s:String, ch:String):String {
  654. var len:Number = s.length;
  655. var idx:Number = 0;
  656. var idx2:Number = 0;
  657. var rs:String = "";
  659. while ((idx2 = s.indexOf(ch, idx) + 1) != 0) {
  660. // include string up to first character in sequence
  661. rs += s.substring(idx, idx2);
  662. idx = idx2;
  664. // remove all subsequent characters in sequence
  665. while ((s.charAt(idx) == ch) && (idx < len)) idx++;
  666. }
  667. return rs + s.substring(idx, len);
  668. }
  669. }
  672. class Math2 {
  674. /**
  675. * @class Math2
  676. * @author Helen Triolo, with inclusions from Robert Penner, Tim Groleau
  677. * @description Math functions not included in Math needed for path->array conversion
  678. */
  680. /**
  681. * @method ratioTo (Groleau)
  682. * @description Returns the point on segment [p1,p2] which is ratio times the total distance
  683. * between p1 and p2 away from p1
  684. * @param p1 (Object) x and y values of point p1
  685. * @param p2 (Object) x and y values of point p2
  686. * @param ratio (Number) real
  687. * @returns Object
  688. */
  689. public static function ratioTo(p1:Object, p2:Object, ratio:Number):Object {
  690. return {x:p1.x + (p2.x - p1.x) * ratio, y:p1.y + (p2.y - p1.y) * ratio };
  691. }
  693. /**
  694. * @method intersect2Lines (Penner)
  695. * @description Returns the point of intersection between two lines
  696. * @param p1, p2 (Objects) points on line 1
  697. * @param p3, p4 (Objects) points on line 2
  698. * @returns Object (point of intersection)
  699. */
  700. public static function intersect2Lines (p1:Object, p2:Object, p3:Object, p4:Object):Object {
  701. var x1:Number = p1.x; var y1:Number = p1.y;
  702. var x4:Number = p4.x; var y4:Number = p4.y;
  703. var dx1:Number = p2.x - x1;
  704. var dx2:Number = p3.x - x4;
  706. if (!(dx1 || dx2)) return NaN;
  707. var m1:Number = (p2.y - y1) / dx1;
  708. var m2:Number = (p3.y - y4) / dx2;
  709. if (!dx1) {
  710. return { x:x1, y:m2 * (x1 - x4) + y4 };
  711. } else if (!dx2) {
  712. return { x:x4, y:m1 * (x4 - x1) + y1 };
  713. }
  714. var xInt:Number = (-m2 * x4 + y4 + m1 * x1 - y1) / (m1 - m2);
  715. var yInt:Number = m1 * (xInt - x1) + y1;
  716. return { x:xInt,y:yInt };
  717. }
  719. /**
  720. * @method rotation
  721. * @description Returns the angle in degrees from the horizontal to a point dy up and dx over
  722. * @param dy (Number) pixels
  723. * @param dx (Number) pixels
  724. * @returns Number (angle, degrees)
  725. */
  726. public static function rotation(dy:Number, dx:Number):Number {
  727. return Math.atan2(dy, dx) * 180/Math.PI;
  728. }
  730. /**
  731. * @method midPt
  732. * @description Returns the midpoint (x/y) of a line segment from p1x/p1y to p2x/p2y
  733. * @param p1x (Number) pixels
  734. * @param p1y (Number) pixels
  735. * @param p2x (Number) pixels
  736. * @param p2y (Number) pixels
  737. * @returns Object (midpoint)
  738. */
  739. public static function midPt(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Object {
  740. return {x:(p1x + p2x)/2, y:(p1y + p2y)/2};
  741. }
  743. /**
  744. * @method getQuadBez_RP (Penner)
  745. * @description Approximates a cubic bezier with as many quadratic bezier segments (n) as required
  746. * to achieve a specified tolerance
  747. * @param p1 (Object) endpoint
  748. * @param c1 (Object) 1st control point
  749. * @param c2 (Object) 2nd control point
  750. * @param p2 (Object) endpoint
  751. * @param k: tolerance (low number = most accurate result)
  752. * @param qcurves (Array) will contain array of quadratic bezier curves, each element containing
  753. * p1x, p1y, cx, cy, p2x, p2y
  754. */
  755. public static function getQuadBez_RP(p1:Object, c1:Object, c2:Object, p2:Object, k:Number, qcurves:Array):void {
  756. // find intersection between bezier arms
  757. var s:Object = Math2.intersect2Lines (p1, c1, c2, p2);
  758. // find distance between the midpoints
  759. var dx:Number = (p1.x + p2.x + s.x * 4 - (c1.x + c2.x) * 3) * .125;
  760. var dy:Number = (p1.y + p2.y + s.y * 4 - (c1.y + c2.y) * 3) * .125;
  761. // split curve if the quadratic isn't close enough
  762. if (dx*dx + dy*dy > k) {
  763. var halves:Object = Math2.bezierSplit (p1.x, p1.y, c1.x, c1.y, c2.x, c2.y, p2.x, p2.y);
  764. var b0:Object = halves.b0; var b1:Object = halves.b1;
  765. // recursive call to subdivide curve
  766. getQuadBez_RP (p1, b0.c1, b0.c2, b0.p2, k, qcurves);
  767. getQuadBez_RP (b1.p1, b1.c1, b1.c2, p2, k, qcurves);
  768. } else {
  769. // end recursion by saving points
  770. qcurves.push({p1x:p1.x, p1y:p1.y, cx:s.x, cy:s.y, p2x:p2.x, p2y:p2.y});
  771. }
  772. }
  774. /**
  775. * @method bezierSplit (Penner)
  776. * @description Divides a cubic bezier curve into two halves (each also cubic beziers)
  777. * @param p1x (Number) pixels, endpoint 1
  778. * @param p1y (Number) pixels
  779. * @param c1x (Number) pixels, control point 1
  780. * @param c1y (Number) pixels
  781. * @param c2x (Number) pixels, control point 2
  782. * @param c2y (Number) pixels
  783. * @param p2x (Number) pixels, endpoint 2
  784. * @param p2y (Number) pixels
  785. * @returns Object (object with two cubic bezier definitions, b0 and b1)
  786. */
  787. public static function bezierSplit(p1x:Number, p1y:Number, c1x:Number, c1y:Number, c2x:Number, c2y:Number, p2x:Number, p2y:Number):Object {
  788. var m:Function = Math2.midPt;
  789. var p1:Object = {x:p1x, y:p1y};
  790. var p2:Object = {x:p2x, y:p2y};
  791. var p01:Object = m (p1x, p1y, c1x, c1y);
  792. var p12:Object = m (c1x, c1y, c2x, c2y);
  793. var p23:Object = m (c2x, c2y, p2x, p2y);
  794. var p02:Object = m (p01.x, p01.y, p12.x, p12.y);
  795. var p13:Object = m (p12.x, p12.y, p23.x, p23.y);
  796. var p03:Object = m (p02.x, p02.y, p13.x, p13.y);
  798. /*
  799. b0:{a:p0, b:p01, c:p02, d:p03},
  800. b1:{a:p03, b:p13, c:p23, d:p3 }
  801. */
  803. return { b0:{p1:p1, c1:p01, c2:p02, p2:p03}, b1:{p1:p03, c1:p13, c2:p23, p2:p2} };
  804. }
  806. /**
  807. * @method pointOnCurve (Penner)
  808. * @description Returns a point on a quadratic bezier curve with Robert Penner's optimization
  809. * of the standard equation:
  810. * {x:p1x * (1-t) * (1-t) + 2 * cx * t * (1-t) + p2x * t * t,
  811. * y:p1y * (1-t) * (1-t) + 2 * cy * t * (1-t) + p2y * t * t }
  812. * @param p1x (Number) pixels, endpoint 1
  813. * @param p1y (Number) pixels
  814. * @param cx (Number) pixels, control point
  815. * @param cy (Number) pixels
  816. * @param p2x (Number) pixels, endpoint 2
  817. * @param p2y (Number) pixels
  818. * @param t (Number) if time is 0-1 along curve, value of t to find point at
  819. * @returns Object (point at time t)
  820. */
  821. public static function pointOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, t:Number):Object {
  822. var o:Object = new Object();
  823. o.x = p1x + t*(2*(1-t)*(cx-p1x) + t*(p2x - p1x));
  824. o.y = p1y + t*(2*(1-t)*(cy-p1y) + t*(p2y - p1y));
  825. return o;
  826. }
  828. /**
  829. * @method pointsOnCurve (Penner)
  830. * @description Returns an array of objects defining points on a quadratic bezier curve, each of which
  831. * includes:
  832. * x,y = location of point defining start of segment
  833. * r = rotation of segment (last entry has none because it's just a point)
  834. * n = number of subdivisions into which curve will be divided (pts = n+1)
  835. * @param p1x (Number) pixels, endpoint 1
  836. * @param p1y (Number) pixels
  837. * @param cx (Number) pixels, control point
  838. * @param cy (Number) pixels
  839. * @param p2x (Number) pixels, endpoint 2
  840. * @param p2y (Number) pixels
  841. * @param n (Number) number of points to return
  842. * @returns Array
  843. */
  844. public static function pointsOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, n:Number):Array {
  845. var pts:Array = [];
  846. for (var i:Number=0; i <= n; i++) {
  847. pts.push(Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, i/n));
  848. if (i > 0) {
  849. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  850. }
  851. }
  852. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  853. return pts;
  854. }
  856. /**
  857. * @method pointsOnLine (Penner)
  858. * @description Returns an array of point positions and rotations for n evenly spaced points
  859. * along a line segment
  860. * x,y = location of point defining start of segment
  861. * r = rotation of segment (last entry has none because it's just a point)
  862. * n = number of subdivisions into which curve will be divided (pts = n+1)
  863. * @param p1x (Number) pixels, endpoint 1
  864. * @param p1y (Number) pixels
  865. * @param p2x (Number) pixels, endpoint 2
  866. * @param p2y (Number) pixels
  867. * @param n (Number) number of points to return
  868. * @returns Array
  869. *//* ....................................................................
  870. Returns an array of point positions and rotation for n evenly spaced points along a line segment
  871. */
  872. public static function pointsOnLine(p1x:Number, p1y:Number, p2x:Number, p2y:Number, n:Number):Array {
  873. var pts:Array = [];
  874. if (p2x != p1x) {
  875. var m:Number = (p2y-p1y)/(p2x-p1x);
  876. var b:Number = p1y - p1x * m;
  877. for (var i:Number=0; i <= n; i++) {
  878. var x:Number = p1x + ((p2x-p1x)/n) * i;
  879. pts.push({x:x, y:m*x+b});
  880. if (i > 0) {
  881. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  882. }
  883. }
  884. // vertical segment
  885. } else {
  886. for (i=0; i<=n; i++) {
  887. pts.push({x:p1x, y:p1y + ((p2y-p1y)/n) * i, r:90});
  888. }
  889. }
  890. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  891. return pts;
  892. }
  894. /**
  895. * @method curveApproxLen
  896. * @description Returns the approximate length of a curved segment, found by dividing it
  897. * into two segments at t=0.5
  898. * @param p1x (Number) pixels, endpoint 1
  899. * @param p1y (Number) pixels
  900. * @param cx (Number) pixels, control point
  901. * @param cy (Number) pixels
  902. * @param p2x (Number) pixels, endpoint 2
  903. * @param p2y (Number) pixels
  904. * @returns Number
  905. */
  906. public static function curveApproxLen(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number):Number {
  907. var mp:Object = Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, 0.5);
  908. var len1:Number = Math.sqrt((mp.x - p1x) * (mp.x - p1x) + (mp.y - p1y) * (mp.y - p1y));
  909. var len2:Number = Math.sqrt((mp.x - p2x) * (mp.x - p2x) + (mp.y - p2y) * (mp.y - p2y));
  910. return len1+len2;
  911. }
  913. /**
  914. * @method lineLen
  915. * @description Returns the length of a line segment
  916. * @param p1x (Number) pixels, endpoint 1
  917. * @param p1y (Number) pixels
  918. * @param p2x (Number) pixels, endpoint 2
  919. * @param p2y (Number) pixels
  920. * @returns Number
  921. */
  922. public static function lineLen(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Number {
  923. return Math.sqrt((p2x - p1x) * (p2x - p1x) + (p2y - p1y) * (p2y - p1y));
  924. }
  926. /**
  927. * @method roundTo
  928. * @description Returns a number rounded to specified number of decimals
  929. * @param n (Number)
  930. * @param ndec (Number) number of decimals to round to
  931. * @returns Number
  932. */
  933. public static function roundTo(n:Number, ndec:Number):Number {
  934. var multiplier:Number = Math.pow(10, ndec);
  935. return Math.round(n*multiplier)/multiplier;
  936. }
  937. }
  941. class SVGColor {
  943. public static function getByName(name:String):Number {
  944. var col:Number = SVGColor._colorTable[name];
  945. return isNaN(col) ? 0 : col;
  946. }
  948. private static const _colorTable:Object = {
  949. blue:0x0000ff,
  950. green:0x008000,
  951. red:0xff0000,
  952. aliceblue:0xf0f8ff,
  953. antiquewhite:0xfaebd7,
  954. aqua:0x00ffff,
  955. aquamarine:0x7fffd4,
  956. azure:0xf0ffff,
  957. beige:0xf5f5dc,
  958. bisque:0xffe4c4,
  959. black:0x000000,
  960. blanchedalmond:0xffebcd,
  961. blueviolet:0x8a2be2,
  962. brown:0xa52a2a,
  963. burlywood:0xdeb887,
  964. cadetblue:0x5f9ea0,
  965. chartreuse:0x7fff00,
  966. chocolate:0xd2691e,
  967. coral:0xff7f50,
  968. cornflowerblue:0x6495ed,
  969. cornsilk:0xfff8dc,
  970. crimson:0xdc143c,
  971. cyan:0x00ffff,
  972. darkblue:0x00008b,
  973. darkcyan:0x008b8b,
  974. darkgoldenrod:0xb8860b,
  975. darkgray:0xa9a9a9,
  976. darkgreen:0x006400,
  977. darkgrey:0xa9a9a9,
  978. darkkhaki:0xbdb76b,
  979. darkmagenta:0x8b008b,
  980. darkolivegreen:0x556b2f,
  981. darkorange:0xff8c00,
  982. darkorchid:0x9932cc,
  983. darkred:0x8b0000,
  984. darksalmon:0xe9967a,
  985. darkseagreen:0x8fbc8f,
  986. darkslateblue:0x483d8b,
  987. darkslategray:0x2f4f4f,
  988. darkslategrey:0x2f4f4f,
  989. darkturquoise:0x00ced1,
  990. darkviolet:0x9400d3,
  991. deeppink:0xff1493,
  992. deepskyblue:0x00bfff,
  993. dimgray:0x696969,
  994. dimgrey:0x696969,
  995. dodgerblue:0x1e90ff,
  996. firebrick:0xb22222,
  997. floralwhite:0xfffaf0,
  998. forestgreen:0x228b22,
  999. fuchsia:0xff00ff,
  1000. gainsboro:0xdcdcdc,
  1001. ghostwhite:0xf8f8ff,
  1002. gold:0xffd700,
  1003. goldenrod:0xdaa520,
  1004. gray:0x808080,
  1005. grey:0x808080,
  1006. greenyellow:0xadff2f,
  1007. honeydew:0xf0fff0,
  1008. hotpink:0xff69b4,
  1009. indianred:0xcd5c5c,
  1010. indigo:0x4b0082,
  1011. ivory:0xfffff0,
  1012. khaki:0xf0e68c,
  1013. lavender:0xe6e6fa,
  1014. lavenderblush:0xfff0f5,
  1015. lawngreen:0x7cfc00,
  1016. lemonchiffon:0xfffacd,
  1017. lightblue:0xadd8e6,
  1018. lightcoral:0xf08080,
  1019. lightcyan:0xe0ffff,
  1020. lightgoldenrodyellow:0xfafad2,
  1021. lightgray:0xd3d3d3,
  1022. lightgreen:0x90ee90,
  1023. lightgrey:0xd3d3d3,
  1024. lightpink:0xffb6c1,
  1025. lightsalmon:0xffa07a,
  1026. lightseagreen:0x20b2aa,
  1027. lightskyblue:0x87cefa,
  1028. lightslategray:0x778899,
  1029. lightslategrey:0x778899,
  1030. lightsteelblue:0xb0c4de,
  1031. lightyellow:0xffffe0,
  1032. lime:0x00ff00,
  1033. limegreen:0x32cd32,
  1034. linen:0xfaf0e6,
  1035. magenta:0xff00ff,
  1036. maroon:0x800000,
  1037. mediumaquamarine:0x66cdaa,
  1038. mediumblue:0x0000cd,
  1039. mediumorchid:0xba55d3,
  1040. mediumpurple:0x9370db,
  1041. mediumseagreen:0x3cb371,
  1042. mediumslateblue:0x7b68ee,
  1043. mediumspringgreen:0x00fa9a,
  1044. mediumturquoise:0x48d1cc,
  1045. mediumvioletred:0xc71585,
  1046. midnightblue:0x191970,
  1047. mintcream:0xf5fffa,
  1048. mistyrose:0xffe4e1,
  1049. moccasin:0xffe4b5,
  1050. navajowhite:0xffdead,
  1051. navy:0x000080,
  1052. oldlace:0xfdf5e6,
  1053. olive:0x808000,
  1054. olivedrab:0x6b8e23,
  1055. orange:0xffa500,
  1056. orangered:0xff4500,
  1057. orchid:0xda70d6,
  1058. palegoldenrod:0xeee8aa,
  1059. palegreen:0x98fb98,
  1060. paleturquoise:0xafeeee,
  1061. palevioletred:0xdb7093,
  1062. papayawhip:0xffefd5,
  1063. peachpuff:0xffdab9,
  1064. peru:0xcd853f,
  1065. pink:0xffc0cb,
  1066. plum:0xdda0dd,
  1067. powderblue:0xb0e0e6,
  1068. purple:0x800080,
  1069. rosybrown:0xbc8f8f,
  1070. royalblue:0x4169e1,
  1071. saddlebrown:0x8b4513,
  1072. salmon:0xfa8072,
  1073. sandybrown:0xf4a460,
  1074. seagreen:0x2e8b57,
  1075. seashell:0xfff5ee,
  1076. sienna:0xa0522d,
  1077. silver:0xc0c0c0,
  1078. skyblue:0x87ceeb,
  1079. slateblue:0x6a5acd,
  1080. slategray:0x708090,
  1081. slategrey:0x708090,
  1082. snow:0xfffafa,
  1083. springgreen:0x00ff7f,
  1084. steelblue:0x4682b4,
  1085. tan:0xd2b48c,
  1086. teal:0x008080,
  1087. thistle:0xd8bfd8,
  1088. tomato:0xff6347,
  1089. turquoise:0x40e0d0,
  1090. violet:0xee82ee,
  1091. wheat:0xf5deb3,
  1092. white:0xffffff,
  1093. whitesmoke:0xf5f5f5,
  1094. yellow:0xffff00,
  1095. yellowgreen:0x9acd32
  1096. }
  1098. }
  1101. class SVGPathCommandType {
  1103. public static const BEGIN_FILL_COMMAND:Number = 1;
  1104. public static const LINE_STYLE_COMMAND:Number = 2;
  1105. public static const MOVE_TO_COMMAND:Number = 3;
  1106. public static const LINE_TO_COMMAND:Number = 4;
  1107. public static const CURVE_TO_COMMAND:Number = 5;
  1109. }
  1112. interface ISVGPathCommand {
  1114. function execute(graphics:Graphics):void;
  1116. }
  1119. class SVGPathCommand implements ISVGPathCommand {
  1121. private var _type:Number;
  1122. public function get type():Number { return this._type; }
  1124. public function SVGPathCommand(type:Number = 0) {
  1125. this._type = type;
  1126. }
  1128. public function execute(graphics:Graphics):void {
  1129. throw new Error('Subclass must be implement execute method.');
  1130. }
  1132. }
  1135. class BeginFillCommand extends SVGPathCommand {
  1137. private var _color:Number;
  1138. public function get color():Number { return this._color; }
  1140. private var _alpha:Number;
  1141. public function get alpha():Number { return this._alpha; }
  1143. public function BeginFillCommand(color:Number, alpha:Number) {
  1144. super(SVGPathCommandType.BEGIN_FILL_COMMAND);
  1145. this._color = color;
  1146. this._alpha = alpha;
  1147. }
  1149. public override function execute(graphics:Graphics):void {
  1150. graphics.beginFill(this._color, this._alpha);
  1151. }
  1153. }
  1156. class CurveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1158. private var _pt1:Point;
  1159. public function get x1():Number { return this._pt1.x; }
  1160. public function get y1():Number { return this._pt1.y; }
  1162. private var _pt2:Point;
  1163. public function get x2():Number { return this._pt2.x; }
  1164. public function get y2():Number { return this._pt2.y; }
  1166. public function CurveToCommand(pt1:Point, pt2:Point) {
  1167. super(SVGPathCommandType.CURVE_TO_COMMAND);
  1168. this._pt1 = pt1;
  1169. this._pt2 = pt2;
  1170. }
  1172. public override function execute(graphics:Graphics):void {
  1173. graphics.curveTo(this._pt1.x, this._pt1.y, this._pt2.x, this._pt2.y);
  1174. }
  1176. }
  1179. class LineStyleCommand extends SVGPathCommand implements ISVGPathCommand {
  1181. private var _width:Number;
  1182. public function get width():Number { return this._width; }
  1184. private var _color:Number;
  1185. public function get color():Number { return this._color; }
  1187. private var _alpha:Number;
  1188. public function get alpha():Number { return this._alpha; }
  1190. public function LineStyleCommand(width:Number, color:Number, alpha:Number) {
  1191. super(SVGPathCommandType.LINE_STYLE_COMMAND);
  1192. this._width = width;
  1193. this._color = color;
  1194. this._alpha = alpha;
  1195. }
  1197. public override function execute(graphics:Graphics):void {
  1198. graphics.lineStyle(this._width, this._color, this._alpha);
  1199. }
  1200. }
  1203. class LineToCommand extends SVGPathCommand implements ISVGPathCommand {
  1205. private var _pt:Point;
  1206. public function get x():Number { return this._pt.x; }
  1207. public function get y():Number { return this._pt.y; }
  1209. public function LineToCommand(pt:Point) {
  1210. super(SVGPathCommandType.LINE_TO_COMMAND);
  1211. this._pt = pt;
  1212. }
  1214. public override function execute(graphics:Graphics):void {
  1215. graphics.lineTo(this._pt.x, this._pt.y);
  1216. }
  1218. }
  1221. class MoveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1223. private var _pt:Point;
  1224. public function get x():Number { return this._pt.x; }
  1225. public function get y():Number { return this._pt.y; }
  1227. public function MoveToCommand(pt:Point) {
  1228. super(SVGPathCommandType.MOVE_TO_COMMAND);
  1229. this._pt = pt;
  1230. }
  1232. public override function execute(graphics:Graphics):void {
  1233. graphics.moveTo(this._pt.x, this._pt.y);
  1234. }
  1236. }
noswf

Sewing forked from: Sewing [diff(1)]

  1. // forked from Saqoosha's Sewing
  2. package {
  4. import caurina.transitions.Equations;
  5. import caurina.transitions.Tweener;
  6. import caurina.transitions.properties.CurveModifiers;
  8. import flash.display.Graphics;
  9. import flash.display.Sprite;
  10. import flash.display.StageAlign;
  11. import flash.display.StageQuality;
  12. import flash.display.StageScaleMode;
  13. import flash.events.Event;
  14. import flash.geom.Point;
  15. import flash.net.URLLoader;
  16. import flash.net.URLLoaderDataFormat;
  17. import flash.net.URLRequest;
  18. import flash.utils.setTimeout;
  20. [SWF(width=465, height=465, backgroundColor=0xffffff, frameRate=60)]
  22. public class Sewing extends Sprite {
  24. private var _loader:URLLoader;
  25. private var _canvas:Sprite;
  26. private var _paths:Array;
  28. public function Sewing() {
  29. Wonderfl.capture_delay(8);
  31. this.stage.quality = StageQuality.BEST;
  32. this.stage.align = StageAlign.TOP_LEFT;
  33. this.stage.scaleMode = StageScaleMode.NO_SCALE;
  35. CurveModifiers.init();
  37. this._canvas = this.addChild(new Sprite()) as Sprite;
  39. this._loader = new URLLoader();
  40. this._loader.dataFormat = URLLoaderDataFormat.TEXT;
  41. this._loader.addEventListener(Event.COMPLETE, this._handleLoaded);
  42. this._loader.load(new URLRequest('http://saqoosha.net/lab/wonderfl/saqoosha.svg'));
  43. }
  45. private function _handleLoaded(e:Event):void {
  46. var svg:XML = new XML(this._loader.data);
  47. this._paths = [];
  48. var path:SVGPath;
  49. var delay:Number = 2.0;
  50. var cx:Number = parseInt(svg.@width) / 2;
  51. var cy:Number = parseInt(svg.@height) / 2;
  52. this._canvas.x = this.stage.stageWidth / 2 - cx;
  53. this._canvas.y = this.stage.stageHeight / 2 - cy;
  54. for each (var pathNode:XML in svg..*::path) {
  55. path = new SVGPath(pathNode);
  56. this._paths.push(path);
  57. var i:Number = 0;
  58. var di:Number = Math.PI * 2 / path.points.length;
  59. var px:Number = cx;
  60. var py:Number = this.stage.stageHeight - this._canvas.y;
  61. for each (var pt:Point in path.points) {
  62. Tweener.addTween(pt, {
  63. x: pt.x,
  64. y: pt.y,
  65. _bezier:[
  66. { x:cx + Math.sin(delay * 1.3) * 300 + Math.sin(delay * 10.3) * 80, y:50 },
  67. { x:100 - Math.sin(delay * 7.2) * 80, y:50 }
  68. ],
  69. time: 1.0,
  70. delay: delay,
  71. transition: Equations.easeNone
  72. });
  73. pt.x = px;
  74. pt.y = py;
  75. delay += 0.004;
  76. i += di;
  77. }
  78. }
  79. this.addEventListener(Event.ENTER_FRAME, this._drawPaths);
  80. setTimeout(function ():void {
  81. removeEventListener(Event.ENTER_FRAME, _drawPaths);
  82. }, (delay + 1) * 1000);
  83. }
  85. private function _drawPaths(e:Event):void {
  86. this._canvas.graphics.clear();
  87. for each (var path:SVGPath in this._paths) {
  88. path.draw(this._canvas.graphics);
  89. }
  90. }
  91. }
  92. }
  108. import flash.display.Graphics;
  109. import flash.geom.Point;
  110. import flash.geom.Rectangle;
  113. /**
  114. * @class PathToArray
  115. * @author Helen Triolo (with contributions from many people)
  116. * @version 1.01
  117. * @description Takes as input an SVG Path node (eg, from Illustrator 10, SVG Factory, etc, but must
  118. * not contain any CRLF characters), and an empty array.
  119. * Parses the path node to make an array of drawing commands, which include cubic bezier
  120. * draw commands. Converts the cubic beziers to an array of equivalent quad beziers,
  121. * using Robert Penner's code to convert with accuracy within 1 pixel.
  122. * Drawing commands are produced in the format originally devised by Peter Hall
  123. * in his ASVDrawing class. These are the possible elements in array dCmds (and the
  124. * corresponding Flash drawing API commands to apply them):
  125. * ['M',[x,y]] moveTo(x,y)
  126. * ['L',[x,y]] lineTo(x,y)
  127. * ['C',[cx,cy,ax,ay]] moveTo(cx,cy,ax,ay)
  128. * ['S',[width,color,alpha]] lineStyle(widtb,color,alpha)
  129. * ['F',[color,alpha]] beginFill(color,alpha)
  130. * ['EF'] endFill()
  131. * History:
  132. * v1.00 2005/11/13 Original release
  133. * v1.01 2006/05/06 Stroke corrected to stroke, line 250 (thanks Gábor Szabó)
  134. *
  135. * @param svgnode (XMLNode) Path node from SVG file
  136. * @param dCmds (Array) Empty array to write commands to
  137. */
  139. class SVGPath {
  141. private var _commands:Array;
  142. public function get commands():Array { return this._commands }
  144. private var _points:Array;
  145. public function get points():Array { return this._points }
  146. private function addPoint(... points:Array):void {
  147. for each (var pt:Point in points) {
  148. this._addPoint(pt);
  149. }
  150. }
  151. private function _addPoint(pt:Point):void {
  152. if (pt.x < this._bounds.left) {
  153. this._bounds.left = pt.x;
  154. } else if (this._bounds.right < pt.x) {
  155. this._bounds.right = pt.x;
  156. }
  157. if (pt.y < this._bounds.top) {
  158. this._bounds.top = pt.y;
  159. } else if (this._bounds.bottom < pt.y) {
  160. this._bounds.bottom = pt.y;
  161. }
  162. this._points.push(pt);
  163. }
  165. private var _bounds:Rectangle;
  166. public function get boundsRect():Rectangle { return this._bounds }
  168. private var _hasFill:Boolean;
  169. public function get hasFill():Boolean { return this._hasFill }
  171. private var _hasStroke:Boolean;
  172. public function get hasStroke():Boolean { return this._hasStroke }
  174. public function swapFillAndStroke():void {
  175. var flg:Boolean = this._hasFill;
  176. this._hasFill = this._hasStroke;
  177. this._hasStroke = flg;
  179. var val:Number = this._fillColor;
  180. this._fillColor = this._strokeColor;
  181. this._strokeColor = val;
  183. val = this._fillAlpha;
  184. this._fillAlpha = this._strokeAlpha;
  185. this._strokeAlpha = val;
  186. }
  188. private var _fillColor:Number;
  189. public function get fillColor():Number { return this._fillColor }
  190. public function set fillColor(col:Number):void { this._fillColor = col }
  192. private var _fillAlpha:Number;
  193. public function get fillAlpha():Number { return this._fillAlpha }
  194. public function set fillAlpha(al:Number):void { this._fillAlpha = al }
  196. private var _strokeColor:Number;
  197. public function get strokeColor():Number { return this._strokeColor }
  198. public function set strokeColor(col:Number):void { this._strokeColor = col }
  200. private var _strokeAlpha:Number;
  201. public function get strokeAlpha():Number { return this._strokeAlpha }
  202. public function set strokeAlpha(al:Number):void { this._strokeAlpha = al }
  204. private var _strokeWidth:Number;
  205. public function get strokeWidth():Number { return this._strokeWidth }
  206. public function set strokeWidth(wd:Number):void { this._strokeWidth = wd }
  208. /**
  209. *
  210. */
  211. public function SVGPath(svgNode:XML) {
  212. this._commands = [];
  213. this._points = [];
  214. this._bounds = new Rectangle();
  215. this._bounds.top = this._bounds.left = Number.MAX_VALUE;
  216. this._bounds.bottom = this._bounds.right = Number.MIN_VALUE;
  217. this._hasFill = false;
  218. this._hasStroke = false;
  220. this.makeDrawCmds(this.extractCmds(svgNode));
  221. }
  223. /**
  224. * @method extractCmds ()
  225. * @param node (XMLNode) SVG path node
  226. * @description Parse path node and convert to array of SVG drawing commands and data
  227. * eg, M,250.8,33.8,c,-33.6,-9.7,-42,19.1,-48.2,22.6,s,-27.9,2.2,-33.3,5.8,
  228. * c,-5.3,3.5,-17.3,23.5,-8.4,41.6
  229. * @returns (Array) array of drawing commands
  230. */
  231. private function extractCmds(node:XML):Array {
  232. var i:Number;
  233. var startColor:Number;
  234. var thisColor:Number;
  236. //var hasFill:Boolean = false;
  237. var hasTransform:Boolean = false;
  238. //var hasStroke:Boolean = false;
  239. var hasStrokeWidth:Boolean = false;
  240. var hasRotate:Number = 0;
  241. var dstring:String = "";
  242. var rotation:Number;
  244. // is there a fill attribute, a transform attribute, a stroke attribute?
  245. for each (var a:XML in node.attributes()) {
  246. switch (a.name().toString()) {
  247. case 'fill': this._hasFill = true; break;
  248. case 'transform': hasTransform = true; break;
  249. case 'stroke': this._hasStroke = true; break;
  250. case 'stroke-width': hasStrokeWidth = true; break;
  251. }
  252. }
  253. if (this._hasFill) {
  254. // parse for fill color specification
  255. // if a hex number is specified, startColor will be > 0
  256. // if a color name is specified, startColor will be 0
  257. var fillStr:String = node.@fill;
  258. if (fillStr == 'none') {
  259. this._hasFill = false;
  260. } else {
  261. startColor = fillStr.indexOf("#") + 1;
  262. if (startColor == 0) { // name specified instead of color number
  263. thisColor = SVGColor.getByName(fillStr);
  264. if (isNaN(thisColor)) {
  265. this._hasFill = false;
  266. } else {
  267. this._fillColor = thisColor;
  268. this._fillAlpha = 1.0;
  269. }
  270. } else {
  271. this._fillColor = parseInt(fillStr.substr(startColor, 6), 16);
  272. this._fillAlpha = 1.0;
  273. }
  274. }
  275. }
  277. // stroke: color, width, alpha
  278. if (this._hasStroke) {
  279. // parse for stroke color specification
  280. var strokeStr:String = node.@stroke;
  281. if (strokeStr == 'none') {
  282. this._hasStroke = false;
  283. } else {
  284. startColor = strokeStr.indexOf("#")+1;
  285. if (startColor == 0) { // name specified instead of color number
  286. thisColor = SVGColor.getByName(strokeStr);
  287. if (isNaN(thisColor)) {
  288. this._hasStroke = false;
  289. } else {
  290. this._strokeWidth = 0;
  291. this._strokeColor = SVGColor.getByName(strokeStr);
  292. this._strokeAlpha = 1.0;
  293. }
  294. } else {
  295. this._strokeWidth = 0;
  296. this._strokeColor = parseInt(strokeStr.substr(startColor,6),16);
  297. this._strokeAlpha = 1.0;
  298. }
  299. }
  300. }
  302. if (hasStrokeWidth) this._strokeWidth = Number(node.attribute("stroke-width"));
  304. // if stroke and fill are both undefined, set fill to black
  305. if (!this._hasFill && !this._hasStroke) {
  306. this._hasFill = true;
  307. this._fillColor = 0;
  308. this._fillAlpha = 1.0;
  309. }
  311. if (hasTransform) {
  312. // parse for rotation specification
  313. var transformStr:String = node.@transform;
  314. hasRotate = transformStr.indexOf("rotate");
  315. if (hasRotate > -1) {
  316. var startRotate:Number = transformStr.indexOf("(");
  317. var endRotate:Number = transformStr.indexOf(")");
  318. rotation = parseInt(transformStr.substr(startRotate+1, endRotate-startRotate));
  319. } else {
  320. rotation = 0;
  321. }
  323. } else rotation = 0;
  325. // if commas included, is it Adobe Illustrator (no spaces) or SVG Factory/other?
  326. dstring = node.@d;
  327. if (dstring.indexOf(",") > -1) { // has commas?
  328. if (dstring.indexOf(" ") > -1) { // yes, has spaces?
  329. // change spaces to commas, then deal as for Illustrator
  330. dstring = String2.replace(dstring," ",",");
  331. }
  332. } else { // no commas
  333. // get rid of extra spaces and change rest to commas
  334. dstring = String2.shrinkSequencesOf(dstring, " ");
  335. dstring = String2.replace(dstring, " ",",");
  336. }
  337. dstring = String2.replace(dstring, "c",",c,");
  338. dstring = String2.replace(dstring, "C",",C,");
  339. dstring = String2.replace(dstring, "S",",S,");
  340. dstring = String2.replace(dstring, "s",",s,");
  341. // separate the z from the last element
  342. dstring = String2.replace(dstring, "z",",z");
  343. // change the following if M can be mid-path
  344. dstring = String2.replace(dstring, "M","M,");
  345. dstring = String2.replace(dstring, "L",",L,");
  346. dstring = String2.replace(dstring, "l",",l,");
  347. dstring = String2.replace(dstring, "H",",H,");
  348. dstring = String2.replace(dstring, "h",",h,");
  349. dstring = String2.replace(dstring, "V",",V,");
  350. dstring = String2.replace(dstring, "v",",v,");
  351. dstring = String2.replace(dstring, "Q",",Q,");
  352. dstring = String2.replace(dstring, "q",",q,");
  353. dstring = String2.replace(dstring, "T",",T,");
  354. dstring = String2.replace(dstring, "t",",t,");
  355. // Adobe includes no delimiter before negative numbers
  356. dstring = String2.replace(dstring, "-",",-");
  357. // get rid of any dup commas we might have introduced
  358. dstring = String2.replace(dstring, ",,",",");
  359. // get rid of spaces
  360. // (cr/lf's have to be removed before the xml object can be created,
  361. // so that is done in xml.onData method)
  362. dstring = String2.replace(dstring, " ","");
  363. dstring = String2.replace(dstring, "\t","");
  365. return dstring.split(",");
  366. }
  368. /**
  369. * @method makeDrawCmds
  370. * @param svgCmds (Array) array of svg draw commands (as output from extractCmds)
  371. * @description Convert svg draw commands to array of ASVDrawing commands: _commands
  372. */
  373. private function makeDrawCmds(svgCmds:Array):void {
  374. var j:Number = 0, ii:int;
  375. var qc:Array;
  376. var firstP:Point;
  377. var lastP:Point;
  378. var lastC:Point;
  379. var cmd:String;
  380. var cp:Point, pp:Point;
  382. do {
  383. cmd = svgCmds[j++];
  384. switch (cmd) {
  385. case "M" :
  386. // moveTo point
  387. firstP = lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  388. if (this._hasFill) {
  389. _commands.push(new BeginFillCommand(this._fillColor, this._fillAlpha));
  390. }
  391. if (this._hasStroke) {
  392. _commands.push(new LineStyleCommand(this._strokeWidth, this._strokeColor, this._strokeAlpha));
  393. }
  394. _commands.push(new MoveToCommand(firstP));
  395. this.addPoint(firstP);
  396. j += 2;
  397. if (j < svgCmds.length && !isNaN(Number(svgCmds[j]))) {
  398. do {
  399. // if multiple points listed, add the rest as lineTo points
  400. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  401. _commands.push(new LineToCommand(lastP));
  402. this.addPoint(lastP);
  403. firstP = lastP;
  404. j += 2;
  405. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  406. }
  407. break;
  409. case "l" :
  410. do {
  411. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  412. _commands.push(new LineToCommand(lastP));
  413. this.addPoint(lastP);
  414. firstP = lastP;
  415. j += 2;
  416. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  417. break;
  419. case "L" :
  420. do {
  421. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  422. _commands.push(new LineToCommand(lastP));
  423. this.addPoint(lastP);
  424. firstP = lastP;
  425. j += 2;
  426. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  427. break;
  429. case "h" :
  430. do {
  431. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y);
  432. _commands.push(new LineToCommand(lastP));
  433. this.addPoint(lastP);
  434. firstP = lastP;
  435. j += 1;
  436. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  437. break;
  439. case "H" :
  440. do {
  441. lastP = new Point(Number(svgCmds[j]), lastP.y);
  442. _commands.push(new LineToCommand(lastP));
  443. this.addPoint(lastP);
  444. firstP = lastP;
  445. j += 1;
  446. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  447. break;
  449. case "v" :
  450. do {
  451. lastP = new Point(lastP.x, lastP.y+Number(svgCmds[j]));
  452. _commands.push(new LineToCommand(lastP));
  453. this.addPoint(lastP);
  454. firstP = lastP;
  455. j += 1;
  456. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  457. break;
  459. case "V" :
  460. do {
  461. lastP = new Point(lastP.x, Number(svgCmds[j]));
  462. _commands.push(new LineToCommand(lastP));
  463. this.addPoint(lastP);
  464. firstP = lastP;
  465. j += 1;
  466. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  467. break;
  469. case "q" :
  470. do {
  471. // control is relative to lastP, not lastC
  472. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  473. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  474. _commands.push(new CurveToCommand(lastC, lastP));
  475. this.addPoint(lastC, lastP);
  476. firstP = lastP;
  477. j += 4;
  478. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  479. break;
  481. case "Q" :
  482. do {
  483. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  484. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  485. _commands.push(new CurveToCommand(lastC, lastP));
  486. this.addPoint(lastC, lastP);
  487. firstP = lastP;
  488. j += 4;
  489. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  490. break;
  492. case "c" :
  493. do {
  494. // don't save if c1.x=c1.y=c2.x=c2.y=0
  495. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  496. } else {
  497. qc = [];
  498. Math2.getQuadBez_RP(
  499. {x:lastP.x, y:lastP.y},
  500. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  501. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  502. {x:lastP.x+Number(svgCmds[j+4]), y:lastP.y+Number(svgCmds[j+5])},
  503. 1, qc);
  504. for (ii=0; ii
  505. cp = new Point(qc[ii].cx, qc[ii].cy);
  506. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  507. _commands.push(new CurveToCommand(cp, pp));
  508. this.addPoint(cp, pp);
  509. }
  510. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  511. lastP = new Point(lastP.x+Number(svgCmds[j+4]), lastP.y+Number(svgCmds[j+5]));
  512. this.addPoint(lastC, lastP);
  513. firstP = lastP;
  514. }
  515. j += 6;
  516. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  517. break;
  519. case "C" :
  520. do {
  521. // don't save if c1.x=c1.y=c2.x=c2.y=0
  522. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  523. } else {
  524. qc = [];
  525. Math2.getQuadBez_RP(
  526. {x:firstP.x, y:firstP.y},
  527. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  528. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  529. {x:Number(svgCmds[j+4]), y:Number(svgCmds[j+5])},
  530. 1, qc);
  531. for (ii=0; ii
  532. cp = new Point(qc[ii].cx, qc[ii].cy);
  533. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  534. _commands.push(new CurveToCommand(cp, pp));
  535. this.addPoint(cp, pp);
  536. }
  537. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  538. lastP = new Point(Number(svgCmds[j+4]), Number(svgCmds[j+5]));
  539. this.addPoint(lastC, lastP);
  540. firstP = lastP;
  541. }
  542. j += 6;
  543. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  544. break;
  546. case "s" :
  547. do {
  548. // don't save if c1.x=c1.y=c2.x=c2.y=0
  549. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  550. } else {
  551. qc = [];
  552. Math2.getQuadBez_RP(
  553. {x:firstP.x, y:firstP.y},
  554. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  555. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  556. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  557. 1, qc);
  558. for (ii=0; ii
  559. cp = new Point(qc[ii].cx, qc[ii].cy);
  560. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  561. _commands.push(new CurveToCommand(cp, pp));
  562. this.addPoint(cp, pp);
  563. }
  564. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  565. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  566. this.addPoint(lastC, lastP);
  567. firstP = lastP;
  568. }
  569. j += 4;
  570. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  571. break;
  573. case "S" :
  574. do {
  575. // don't save if c1.x=c1.y=c2.x=c2.y=0
  576. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  577. } else {
  578. qc = [];
  579. Math2.getQuadBez_RP(
  580. {x:firstP.x, y:firstP.y},
  581. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  582. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  583. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  584. 1, qc);
  585. for (ii=0; ii
  586. cp = new Point(qc[ii].cx, qc[ii].cy);
  587. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  588. _commands.push(new CurveToCommand(cp, pp));
  589. this.addPoint(cp, pp);
  590. }
  591. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  592. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  593. this.addPoint(lastC, lastP);
  594. firstP = lastP;
  595. }
  596. j += 4;
  597. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  598. break;
  600. case "z" :
  601. case "Z" :
  602. if (!firstP.equals(lastP)) {
  603. _commands.push(new LineToCommand(firstP));
  604. this.addPoint(firstP);
  605. }
  606. j++;
  607. break;
  609. } // end switch
  610. } while (j < svgCmds.length);
  611. }
  613. /**
  614. *
  615. */
  616. public function draw(graphics:Graphics):void {
  617. for each (var command:SVGPathCommand in this._commands) {
  618. command.execute(graphics);
  619. }
  620. }
  622. }
  626. class String2 {
  628. /**
  629. * @class String2
  630. * @author Helen Triolo, with inclusions from Tim Groleau
  631. * @description String functions not included in String needed for path->array conversion
  632. */
  634. /**
  635. * @method replace ()
  636. * @description Replaces sFind in s with sReplace
  637. * @param s (String) original string
  638. * @param sFind (String) part to be replaced
  639. * @param sReplace (String) string to replace it with
  640. * @returns (String) string with replacement
  641. */
  642. public static function replace(s:String, sFind:String, sReplace:String):String {
  643. return s.split(sFind).join(sReplace);
  644. }
  646. /**
  647. * @method shrinkSequencesOf (Groleau)
  648. * @description Shrinks all sequences of a given character in a string to one
  649. * @param s (String) original string
  650. * @param ch (String) character to be found
  651. * @returns (String) string with sequences shrunk
  652. */
  653. public static function shrinkSequencesOf(s:String, ch:String):String {
  654. var len:Number = s.length;
  655. var idx:Number = 0;
  656. var idx2:Number = 0;
  657. var rs:String = "";
  659. while ((idx2 = s.indexOf(ch, idx) + 1) != 0) {
  660. // include string up to first character in sequence
  661. rs += s.substring(idx, idx2);
  662. idx = idx2;
  664. // remove all subsequent characters in sequence
  665. while ((s.charAt(idx) == ch) && (idx < len)) idx++;
  666. }
  667. return rs + s.substring(idx, len);
  668. }
  669. }
  672. class Math2 {
  674. /**
  675. * @class Math2
  676. * @author Helen Triolo, with inclusions from Robert Penner, Tim Groleau
  677. * @description Math functions not included in Math needed for path->array conversion
  678. */
  680. /**
  681. * @method ratioTo (Groleau)
  682. * @description Returns the point on segment [p1,p2] which is ratio times the total distance
  683. * between p1 and p2 away from p1
  684. * @param p1 (Object) x and y values of point p1
  685. * @param p2 (Object) x and y values of point p2
  686. * @param ratio (Number) real
  687. * @returns Object
  688. */
  689. public static function ratioTo(p1:Object, p2:Object, ratio:Number):Object {
  690. return {x:p1.x + (p2.x - p1.x) * ratio, y:p1.y + (p2.y - p1.y) * ratio };
  691. }
  693. /**
  694. * @method intersect2Lines (Penner)
  695. * @description Returns the point of intersection between two lines
  696. * @param p1, p2 (Objects) points on line 1
  697. * @param p3, p4 (Objects) points on line 2
  698. * @returns Object (point of intersection)
  699. */
  700. public static function intersect2Lines (p1:Object, p2:Object, p3:Object, p4:Object):Object {
  701. var x1:Number = p1.x; var y1:Number = p1.y;
  702. var x4:Number = p4.x; var y4:Number = p4.y;
  703. var dx1:Number = p2.x - x1;
  704. var dx2:Number = p3.x - x4;
  706. if (!(dx1 || dx2)) return NaN;
  707. var m1:Number = (p2.y - y1) / dx1;
  708. var m2:Number = (p3.y - y4) / dx2;
  709. if (!dx1) {
  710. return { x:x1, y:m2 * (x1 - x4) + y4 };
  711. } else if (!dx2) {
  712. return { x:x4, y:m1 * (x4 - x1) + y1 };
  713. }
  714. var xInt:Number = (-m2 * x4 + y4 + m1 * x1 - y1) / (m1 - m2);
  715. var yInt:Number = m1 * (xInt - x1) + y1;
  716. return { x:xInt,y:yInt };
  717. }
  719. /**
  720. * @method rotation
  721. * @description Returns the angle in degrees from the horizontal to a point dy up and dx over
  722. * @param dy (Number) pixels
  723. * @param dx (Number) pixels
  724. * @returns Number (angle, degrees)
  725. */
  726. public static function rotation(dy:Number, dx:Number):Number {
  727. return Math.atan2(dy, dx) * 180/Math.PI;
  728. }
  730. /**
  731. * @method midPt
  732. * @description Returns the midpoint (x/y) of a line segment from p1x/p1y to p2x/p2y
  733. * @param p1x (Number) pixels
  734. * @param p1y (Number) pixels
  735. * @param p2x (Number) pixels
  736. * @param p2y (Number) pixels
  737. * @returns Object (midpoint)
  738. */
  739. public static function midPt(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Object {
  740. return {x:(p1x + p2x)/2, y:(p1y + p2y)/2};
  741. }
  743. /**
  744. * @method getQuadBez_RP (Penner)
  745. * @description Approximates a cubic bezier with as many quadratic bezier segments (n) as required
  746. * to achieve a specified tolerance
  747. * @param p1 (Object) endpoint
  748. * @param c1 (Object) 1st control point
  749. * @param c2 (Object) 2nd control point
  750. * @param p2 (Object) endpoint
  751. * @param k: tolerance (low number = most accurate result)
  752. * @param qcurves (Array) will contain array of quadratic bezier curves, each element containing
  753. * p1x, p1y, cx, cy, p2x, p2y
  754. */
  755. public static function getQuadBez_RP(p1:Object, c1:Object, c2:Object, p2:Object, k:Number, qcurves:Array):void {
  756. // find intersection between bezier arms
  757. var s:Object = Math2.intersect2Lines (p1, c1, c2, p2);
  758. // find distance between the midpoints
  759. var dx:Number = (p1.x + p2.x + s.x * 4 - (c1.x + c2.x) * 3) * .125;
  760. var dy:Number = (p1.y + p2.y + s.y * 4 - (c1.y + c2.y) * 3) * .125;
  761. // split curve if the quadratic isn't close enough
  762. if (dx*dx + dy*dy > k) {
  763. var halves:Object = Math2.bezierSplit (p1.x, p1.y, c1.x, c1.y, c2.x, c2.y, p2.x, p2.y);
  764. var b0:Object = halves.b0; var b1:Object = halves.b1;
  765. // recursive call to subdivide curve
  766. getQuadBez_RP (p1, b0.c1, b0.c2, b0.p2, k, qcurves);
  767. getQuadBez_RP (b1.p1, b1.c1, b1.c2, p2, k, qcurves);
  768. } else {
  769. // end recursion by saving points
  770. qcurves.push({p1x:p1.x, p1y:p1.y, cx:s.x, cy:s.y, p2x:p2.x, p2y:p2.y});
  771. }
  772. }
  774. /**
  775. * @method bezierSplit (Penner)
  776. * @description Divides a cubic bezier curve into two halves (each also cubic beziers)
  777. * @param p1x (Number) pixels, endpoint 1
  778. * @param p1y (Number) pixels
  779. * @param c1x (Number) pixels, control point 1
  780. * @param c1y (Number) pixels
  781. * @param c2x (Number) pixels, control point 2
  782. * @param c2y (Number) pixels
  783. * @param p2x (Number) pixels, endpoint 2
  784. * @param p2y (Number) pixels
  785. * @returns Object (object with two cubic bezier definitions, b0 and b1)
  786. */
  787. public static function bezierSplit(p1x:Number, p1y:Number, c1x:Number, c1y:Number, c2x:Number, c2y:Number, p2x:Number, p2y:Number):Object {
  788. var m:Function = Math2.midPt;
  789. var p1:Object = {x:p1x, y:p1y};
  790. var p2:Object = {x:p2x, y:p2y};
  791. var p01:Object = m (p1x, p1y, c1x, c1y);
  792. var p12:Object = m (c1x, c1y, c2x, c2y);
  793. var p23:Object = m (c2x, c2y, p2x, p2y);
  794. var p02:Object = m (p01.x, p01.y, p12.x, p12.y);
  795. var p13:Object = m (p12.x, p12.y, p23.x, p23.y);
  796. var p03:Object = m (p02.x, p02.y, p13.x, p13.y);
  798. /*
  799. b0:{a:p0, b:p01, c:p02, d:p03},
  800. b1:{a:p03, b:p13, c:p23, d:p3 }
  801. */
  803. return { b0:{p1:p1, c1:p01, c2:p02, p2:p03}, b1:{p1:p03, c1:p13, c2:p23, p2:p2} };
  804. }
  806. /**
  807. * @method pointOnCurve (Penner)
  808. * @description Returns a point on a quadratic bezier curve with Robert Penner's optimization
  809. * of the standard equation:
  810. * {x:p1x * (1-t) * (1-t) + 2 * cx * t * (1-t) + p2x * t * t,
  811. * y:p1y * (1-t) * (1-t) + 2 * cy * t * (1-t) + p2y * t * t }
  812. * @param p1x (Number) pixels, endpoint 1
  813. * @param p1y (Number) pixels
  814. * @param cx (Number) pixels, control point
  815. * @param cy (Number) pixels
  816. * @param p2x (Number) pixels, endpoint 2
  817. * @param p2y (Number) pixels
  818. * @param t (Number) if time is 0-1 along curve, value of t to find point at
  819. * @returns Object (point at time t)
  820. */
  821. public static function pointOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, t:Number):Object {
  822. var o:Object = new Object();
  823. o.x = p1x + t*(2*(1-t)*(cx-p1x) + t*(p2x - p1x));
  824. o.y = p1y + t*(2*(1-t)*(cy-p1y) + t*(p2y - p1y));
  825. return o;
  826. }
  828. /**
  829. * @method pointsOnCurve (Penner)
  830. * @description Returns an array of objects defining points on a quadratic bezier curve, each of which
  831. * includes:
  832. * x,y = location of point defining start of segment
  833. * r = rotation of segment (last entry has none because it's just a point)
  834. * n = number of subdivisions into which curve will be divided (pts = n+1)
  835. * @param p1x (Number) pixels, endpoint 1
  836. * @param p1y (Number) pixels
  837. * @param cx (Number) pixels, control point
  838. * @param cy (Number) pixels
  839. * @param p2x (Number) pixels, endpoint 2
  840. * @param p2y (Number) pixels
  841. * @param n (Number) number of points to return
  842. * @returns Array
  843. */
  844. public static function pointsOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, n:Number):Array {
  845. var pts:Array = [];
  846. for (var i:Number=0; i <= n; i++) {
  847. pts.push(Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, i/n));
  848. if (i > 0) {
  849. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  850. }
  851. }
  852. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  853. return pts;
  854. }
  856. /**
  857. * @method pointsOnLine (Penner)
  858. * @description Returns an array of point positions and rotations for n evenly spaced points
  859. * along a line segment
  860. * x,y = location of point defining start of segment
  861. * r = rotation of segment (last entry has none because it's just a point)
  862. * n = number of subdivisions into which curve will be divided (pts = n+1)
  863. * @param p1x (Number) pixels, endpoint 1
  864. * @param p1y (Number) pixels
  865. * @param p2x (Number) pixels, endpoint 2
  866. * @param p2y (Number) pixels
  867. * @param n (Number) number of points to return
  868. * @returns Array
  869. *//* ....................................................................
  870. Returns an array of point positions and rotation for n evenly spaced points along a line segment
  871. */
  872. public static function pointsOnLine(p1x:Number, p1y:Number, p2x:Number, p2y:Number, n:Number):Array {
  873. var pts:Array = [];
  874. if (p2x != p1x) {
  875. var m:Number = (p2y-p1y)/(p2x-p1x);
  876. var b:Number = p1y - p1x * m;
  877. for (var i:Number=0; i <= n; i++) {
  878. var x:Number = p1x + ((p2x-p1x)/n) * i;
  879. pts.push({x:x, y:m*x+b});
  880. if (i > 0) {
  881. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  882. }
  883. }
  884. // vertical segment
  885. } else {
  886. for (i=0; i<=n; i++) {
  887. pts.push({x:p1x, y:p1y + ((p2y-p1y)/n) * i, r:90});
  888. }
  889. }
  890. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  891. return pts;
  892. }
  894. /**
  895. * @method curveApproxLen
  896. * @description Returns the approximate length of a curved segment, found by dividing it
  897. * into two segments at t=0.5
  898. * @param p1x (Number) pixels, endpoint 1
  899. * @param p1y (Number) pixels
  900. * @param cx (Number) pixels, control point
  901. * @param cy (Number) pixels
  902. * @param p2x (Number) pixels, endpoint 2
  903. * @param p2y (Number) pixels
  904. * @returns Number
  905. */
  906. public static function curveApproxLen(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number):Number {
  907. var mp:Object = Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, 0.5);
  908. var len1:Number = Math.sqrt((mp.x - p1x) * (mp.x - p1x) + (mp.y - p1y) * (mp.y - p1y));
  909. var len2:Number = Math.sqrt((mp.x - p2x) * (mp.x - p2x) + (mp.y - p2y) * (mp.y - p2y));
  910. return len1+len2;
  911. }
  913. /**
  914. * @method lineLen
  915. * @description Returns the length of a line segment
  916. * @param p1x (Number) pixels, endpoint 1
  917. * @param p1y (Number) pixels
  918. * @param p2x (Number) pixels, endpoint 2
  919. * @param p2y (Number) pixels
  920. * @returns Number
  921. */
  922. public static function lineLen(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Number {
  923. return Math.sqrt((p2x - p1x) * (p2x - p1x) + (p2y - p1y) * (p2y - p1y));
  924. }
  926. /**
  927. * @method roundTo
  928. * @description Returns a number rounded to specified number of decimals
  929. * @param n (Number)
  930. * @param ndec (Number) number of decimals to round to
  931. * @returns Number
  932. */
  933. public static function roundTo(n:Number, ndec:Number):Number {
  934. var multiplier:Number = Math.pow(10, ndec);
  935. return Math.round(n*multiplier)/multiplier;
  936. }
  937. }
  941. class SVGColor {
  943. public static function getByName(name:String):Number {
  944. var col:Number = SVGColor._colorTable[name];
  945. return isNaN(col) ? 0 : col;
  946. }
  948. private static const _colorTable:Object = {
  949. blue:0x0000ff,
  950. green:0x008000,
  951. red:0xff0000,
  952. aliceblue:0xf0f8ff,
  953. antiquewhite:0xfaebd7,
  954. aqua:0x00ffff,
  955. aquamarine:0x7fffd4,
  956. azure:0xf0ffff,
  957. beige:0xf5f5dc,
  958. bisque:0xffe4c4,
  959. black:0x000000,
  960. blanchedalmond:0xffebcd,
  961. blueviolet:0x8a2be2,
  962. brown:0xa52a2a,
  963. burlywood:0xdeb887,
  964. cadetblue:0x5f9ea0,
  965. chartreuse:0x7fff00,
  966. chocolate:0xd2691e,
  967. coral:0xff7f50,
  968. cornflowerblue:0x6495ed,
  969. cornsilk:0xfff8dc,
  970. crimson:0xdc143c,
  971. cyan:0x00ffff,
  972. darkblue:0x00008b,
  973. darkcyan:0x008b8b,
  974. darkgoldenrod:0xb8860b,
  975. darkgray:0xa9a9a9,
  976. darkgreen:0x006400,
  977. darkgrey:0xa9a9a9,
  978. darkkhaki:0xbdb76b,
  979. darkmagenta:0x8b008b,
  980. darkolivegreen:0x556b2f,
  981. darkorange:0xff8c00,
  982. darkorchid:0x9932cc,
  983. darkred:0x8b0000,
  984. darksalmon:0xe9967a,
  985. darkseagreen:0x8fbc8f,
  986. darkslateblue:0x483d8b,
  987. darkslategray:0x2f4f4f,
  988. darkslategrey:0x2f4f4f,
  989. darkturquoise:0x00ced1,
  990. darkviolet:0x9400d3,
  991. deeppink:0xff1493,
  992. deepskyblue:0x00bfff,
  993. dimgray:0x696969,
  994. dimgrey:0x696969,
  995. dodgerblue:0x1e90ff,
  996. firebrick:0xb22222,
  997. floralwhite:0xfffaf0,
  998. forestgreen:0x228b22,
  999. fuchsia:0xff00ff,
  1000. gainsboro:0xdcdcdc,
  1001. ghostwhite:0xf8f8ff,
  1002. gold:0xffd700,
  1003. goldenrod:0xdaa520,
  1004. gray:0x808080,
  1005. grey:0x808080,
  1006. greenyellow:0xadff2f,
  1007. honeydew:0xf0fff0,
  1008. hotpink:0xff69b4,
  1009. indianred:0xcd5c5c,
  1010. indigo:0x4b0082,
  1011. ivory:0xfffff0,
  1012. khaki:0xf0e68c,
  1013. lavender:0xe6e6fa,
  1014. lavenderblush:0xfff0f5,
  1015. lawngreen:0x7cfc00,
  1016. lemonchiffon:0xfffacd,
  1017. lightblue:0xadd8e6,
  1018. lightcoral:0xf08080,
  1019. lightcyan:0xe0ffff,
  1020. lightgoldenrodyellow:0xfafad2,
  1021. lightgray:0xd3d3d3,
  1022. lightgreen:0x90ee90,
  1023. lightgrey:0xd3d3d3,
  1024. lightpink:0xffb6c1,
  1025. lightsalmon:0xffa07a,
  1026. lightseagreen:0x20b2aa,
  1027. lightskyblue:0x87cefa,
  1028. lightslategray:0x778899,
  1029. lightslategrey:0x778899,
  1030. lightsteelblue:0xb0c4de,
  1031. lightyellow:0xffffe0,
  1032. lime:0x00ff00,
  1033. limegreen:0x32cd32,
  1034. linen:0xfaf0e6,
  1035. magenta:0xff00ff,
  1036. maroon:0x800000,
  1037. mediumaquamarine:0x66cdaa,
  1038. mediumblue:0x0000cd,
  1039. mediumorchid:0xba55d3,
  1040. mediumpurple:0x9370db,
  1041. mediumseagreen:0x3cb371,
  1042. mediumslateblue:0x7b68ee,
  1043. mediumspringgreen:0x00fa9a,
  1044. mediumturquoise:0x48d1cc,
  1045. mediumvioletred:0xc71585,
  1046. midnightblue:0x191970,
  1047. mintcream:0xf5fffa,
  1048. mistyrose:0xffe4e1,
  1049. moccasin:0xffe4b5,
  1050. navajowhite:0xffdead,
  1051. navy:0x000080,
  1052. oldlace:0xfdf5e6,
  1053. olive:0x808000,
  1054. olivedrab:0x6b8e23,
  1055. orange:0xffa500,
  1056. orangered:0xff4500,
  1057. orchid:0xda70d6,
  1058. palegoldenrod:0xeee8aa,
  1059. palegreen:0x98fb98,
  1060. paleturquoise:0xafeeee,
  1061. palevioletred:0xdb7093,
  1062. papayawhip:0xffefd5,
  1063. peachpuff:0xffdab9,
  1064. peru:0xcd853f,
  1065. pink:0xffc0cb,
  1066. plum:0xdda0dd,
  1067. powderblue:0xb0e0e6,
  1068. purple:0x800080,
  1069. rosybrown:0xbc8f8f,
  1070. royalblue:0x4169e1,
  1071. saddlebrown:0x8b4513,
  1072. salmon:0xfa8072,
  1073. sandybrown:0xf4a460,
  1074. seagreen:0x2e8b57,
  1075. seashell:0xfff5ee,
  1076. sienna:0xa0522d,
  1077. silver:0xc0c0c0,
  1078. skyblue:0x87ceeb,
  1079. slateblue:0x6a5acd,
  1080. slategray:0x708090,
  1081. slategrey:0x708090,
  1082. snow:0xfffafa,
  1083. springgreen:0x00ff7f,
  1084. steelblue:0x4682b4,
  1085. tan:0xd2b48c,
  1086. teal:0x008080,
  1087. thistle:0xd8bfd8,
  1088. tomato:0xff6347,
  1089. turquoise:0x40e0d0,
  1090. violet:0xee82ee,
  1091. wheat:0xf5deb3,
  1092. white:0xffffff,
  1093. whitesmoke:0xf5f5f5,
  1094. yellow:0xffff00,
  1095. yellowgreen:0x9acd32
  1096. }
  1098. }
  1101. class SVGPathCommandType {
  1103. public static const BEGIN_FILL_COMMAND:Number = 1;
  1104. public static const LINE_STYLE_COMMAND:Number = 2;
  1105. public static const MOVE_TO_COMMAND:Number = 3;
  1106. public static const LINE_TO_COMMAND:Number = 4;
  1107. public static const CURVE_TO_COMMAND:Number = 5;
  1109. }
  1112. interface ISVGPathCommand {
  1114. function execute(graphics:Graphics):void;
  1116. }
  1119. class SVGPathCommand implements ISVGPathCommand {
  1121. private var _type:Number;
  1122. public function get type():Number { return this._type; }
  1124. public function SVGPathCommand(type:Number = 0) {
  1125. this._type = type;
  1126. }
  1128. public function execute(graphics:Graphics):void {
  1129. throw new Error('Subclass must be implement execute method.');
  1130. }
  1132. }
  1135. class BeginFillCommand extends SVGPathCommand {
  1137. private var _color:Number;
  1138. public function get color():Number { return this._color; }
  1140. private var _alpha:Number;
  1141. public function get alpha():Number { return this._alpha; }
  1143. public function BeginFillCommand(color:Number, alpha:Number) {
  1144. super(SVGPathCommandType.BEGIN_FILL_COMMAND);
  1145. this._color = color;
  1146. this._alpha = alpha;
  1147. }
  1149. public override function execute(graphics:Graphics):void {
  1150. graphics.beginFill(this._color, this._alpha);
  1151. }
  1153. }
  1156. class CurveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1158. private var _pt1:Point;
  1159. public function get x1():Number { return this._pt1.x; }
  1160. public function get y1():Number { return this._pt1.y; }
  1162. private var _pt2:Point;
  1163. public function get x2():Number { return this._pt2.x; }
  1164. public function get y2():Number { return this._pt2.y; }
  1166. public function CurveToCommand(pt1:Point, pt2:Point) {
  1167. super(SVGPathCommandType.CURVE_TO_COMMAND);
  1168. this._pt1 = pt1;
  1169. this._pt2 = pt2;
  1170. }
  1172. public override function execute(graphics:Graphics):void {
  1173. graphics.curveTo(this._pt1.x, this._pt1.y, this._pt2.x, this._pt2.y);
  1174. }
  1176. }
  1179. class LineStyleCommand extends SVGPathCommand implements ISVGPathCommand {
  1181. private var _width:Number;
  1182. public function get width():Number { return this._width; }
  1184. private var _color:Number;
  1185. public function get color():Number { return this._color; }
  1187. private var _alpha:Number;
  1188. public function get alpha():Number { return this._alpha; }
  1190. public function LineStyleCommand(width:Number, color:Number, alpha:Number) {
  1191. super(SVGPathCommandType.LINE_STYLE_COMMAND);
  1192. this._width = width;
  1193. this._color = color;
  1194. this._alpha = alpha;
  1195. }
  1197. public override function execute(graphics:Graphics):void {
  1198. graphics.lineStyle(this._width, this._color, this._alpha);
  1199. }
  1200. }
  1203. class LineToCommand extends SVGPathCommand implements ISVGPathCommand {
  1205. private var _pt:Point;
  1206. public function get x():Number { return this._pt.x; }
  1207. public function get y():Number { return this._pt.y; }
  1209. public function LineToCommand(pt:Point) {
  1210. super(SVGPathCommandType.LINE_TO_COMMAND);
  1211. this._pt = pt;
  1212. }
  1214. public override function execute(graphics:Graphics):void {
  1215. graphics.lineTo(this._pt.x, this._pt.y);
  1216. }
  1218. }
  1221. class MoveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1223. private var _pt:Point;
  1224. public function get x():Number { return this._pt.x; }
  1225. public function get y():Number { return this._pt.y; }
  1227. public function MoveToCommand(pt:Point) {
  1228. super(SVGPathCommandType.MOVE_TO_COMMAND);
  1229. this._pt = pt;
  1230. }
  1232. public override function execute(graphics:Graphics):void {
  1233. graphics.moveTo(this._pt.x, this._pt.y);
  1234. }
  1236. }
noswf

Sewing forked from: Sewing [diff(2)]

  1. // forked from Saqoosha's Sewing
  2. package {
  4. import caurina.transitions.Equations;
  5. import caurina.transitions.Tweener;
  6. import caurina.transitions.properties.CurveModifiers;
  8. import flash.display.Graphics;
  9. import flash.display.Sprite;
  10. import flash.display.StageAlign;
  11. import flash.display.StageQuality;
  12. import flash.display.StageScaleMode;
  13. import flash.events.Event;
  14. import flash.geom.Point;
  15. import flash.net.URLLoader;
  16. import flash.net.URLLoaderDataFormat;
  17. import flash.net.URLRequest;
  18. import flash.utils.setTimeout;
  20. [SWF(width=465, height=465, backgroundColor=0xffffff, frameRate=60)]
  22. public class Sewing extends Sprite {
  24. private var _loader:URLLoader;
  25. private var _canvas:Sprite;
  26. private var _paths:Array;
  28. public function Sewing() {
  29. Wonderfl.capture_delay(8);
  31. this.stage.quality = StageQuality.BEST;
  32. this.stage.align = StageAlign.TOP_LEFT;
  33. this.stage.scaleMode = StageScaleMode.NO_SCALE;
  35. CurveModifiers.init();
  37. this._canvas = this.addChild(new Sprite()) as Sprite;
  39. this._loader = new URLLoader();
  40. this._loader.dataFormat = URLLoaderDataFormat.TEXT;
  41. this._loader.addEventListener(Event.COMPLETE, this._handleLoaded);
  42. this._loader.load(new URLRequest('http://upload.wikimedia.org/wikipedia/commons/9/9c/Flag_of_Denmark.svg'));
  43. }
  45. private function _handleLoaded(e:Event):void {
  46. var svg:XML = new XML(this._loader.data);
  47. this._paths = [];
  48. var path:SVGPath;
  49. var delay:Number = 2.0;
  50. var cx:Number = parseInt(svg.@width) / 2;
  51. var cy:Number = parseInt(svg.@height) / 2;
  52. this._canvas.x = this.stage.stageWidth / 2 - cx;
  53. this._canvas.y = this.stage.stageHeight / 2 - cy;
  54. for each (var pathNode:XML in svg..*::path) {
  55. path = new SVGPath(pathNode);
  56. this._paths.push(path);
  57. var i:Number = 0;
  58. var di:Number = Math.PI * 2 / path.points.length;
  59. var px:Number = cx;
  60. var py:Number = this.stage.stageHeight - this._canvas.y;
  61. for each (var pt:Point in path.points) {
  62. Tweener.addTween(pt, {
  63. x: pt.x,
  64. y: pt.y,
  65. _bezier:[
  66. { x:cx + Math.sin(delay * 1.3) * 300 + Math.sin(delay * 10.3) * 80, y:50 },
  67. { x:100 - Math.sin(delay * 7.2) * 80, y:50 }
  68. ],
  69. time: 1.0,
  70. delay: delay,
  71. transition: Equations.easeNone
  72. });
  73. pt.x = px;
  74. pt.y = py;
  75. delay += 0.004;
  76. i += di;
  77. }
  78. }
  79. this.addEventListener(Event.ENTER_FRAME, this._drawPaths);
  80. setTimeout(function ():void {
  81. removeEventListener(Event.ENTER_FRAME, _drawPaths);
  82. }, (delay + 1) * 1000);
  83. }
  85. private function _drawPaths(e:Event):void {
  86. this._canvas.graphics.clear();
  87. for each (var path:SVGPath in this._paths) {
  88. path.draw(this._canvas.graphics);
  89. }
  90. }
  91. }
  92. }
  108. import flash.display.Graphics;
  109. import flash.geom.Point;
  110. import flash.geom.Rectangle;
  113. /**
  114. * @class PathToArray
  115. * @author Helen Triolo (with contributions from many people)
  116. * @version 1.01
  117. * @description Takes as input an SVG Path node (eg, from Illustrator 10, SVG Factory, etc, but must
  118. * not contain any CRLF characters), and an empty array.
  119. * Parses the path node to make an array of drawing commands, which include cubic bezier
  120. * draw commands. Converts the cubic beziers to an array of equivalent quad beziers,
  121. * using Robert Penner's code to convert with accuracy within 1 pixel.
  122. * Drawing commands are produced in the format originally devised by Peter Hall
  123. * in his ASVDrawing class. These are the possible elements in array dCmds (and the
  124. * corresponding Flash drawing API commands to apply them):
  125. * ['M',[x,y]] moveTo(x,y)
  126. * ['L',[x,y]] lineTo(x,y)
  127. * ['C',[cx,cy,ax,ay]] moveTo(cx,cy,ax,ay)
  128. * ['S',[width,color,alpha]] lineStyle(widtb,color,alpha)
  129. * ['F',[color,alpha]] beginFill(color,alpha)
  130. * ['EF'] endFill()
  131. * History:
  132. * v1.00 2005/11/13 Original release
  133. * v1.01 2006/05/06 Stroke corrected to stroke, line 250 (thanks Gábor Szabó)
  134. *
  135. * @param svgnode (XMLNode) Path node from SVG file
  136. * @param dCmds (Array) Empty array to write commands to
  137. */
  139. class SVGPath {
  141. private var _commands:Array;
  142. public function get commands():Array { return this._commands }
  144. private var _points:Array;
  145. public function get points():Array { return this._points }
  146. private function addPoint(... points:Array):void {
  147. for each (var pt:Point in points) {
  148. this._addPoint(pt);
  149. }
  150. }
  151. private function _addPoint(pt:Point):void {
  152. if (pt.x < this._bounds.left) {
  153. this._bounds.left = pt.x;
  154. } else if (this._bounds.right < pt.x) {
  155. this._bounds.right = pt.x;
  156. }
  157. if (pt.y < this._bounds.top) {
  158. this._bounds.top = pt.y;
  159. } else if (this._bounds.bottom < pt.y) {
  160. this._bounds.bottom = pt.y;
  161. }
  162. this._points.push(pt);
  163. }
  165. private var _bounds:Rectangle;
  166. public function get boundsRect():Rectangle { return this._bounds }
  168. private var _hasFill:Boolean;
  169. public function get hasFill():Boolean { return this._hasFill }
  171. private var _hasStroke:Boolean;
  172. public function get hasStroke():Boolean { return this._hasStroke }
  174. public function swapFillAndStroke():void {
  175. var flg:Boolean = this._hasFill;
  176. this._hasFill = this._hasStroke;
  177. this._hasStroke = flg;
  179. var val:Number = this._fillColor;
  180. this._fillColor = this._strokeColor;
  181. this._strokeColor = val;
  183. val = this._fillAlpha;
  184. this._fillAlpha = this._strokeAlpha;
  185. this._strokeAlpha = val;
  186. }
  188. private var _fillColor:Number;
  189. public function get fillColor():Number { return this._fillColor }
  190. public function set fillColor(col:Number):void { this._fillColor = col }
  192. private var _fillAlpha:Number;
  193. public function get fillAlpha():Number { return this._fillAlpha }
  194. public function set fillAlpha(al:Number):void { this._fillAlpha = al }
  196. private var _strokeColor:Number;
  197. public function get strokeColor():Number { return this._strokeColor }
  198. public function set strokeColor(col:Number):void { this._strokeColor = col }
  200. private var _strokeAlpha:Number;
  201. public function get strokeAlpha():Number { return this._strokeAlpha }
  202. public function set strokeAlpha(al:Number):void { this._strokeAlpha = al }
  204. private var _strokeWidth:Number;
  205. public function get strokeWidth():Number { return this._strokeWidth }
  206. public function set strokeWidth(wd:Number):void { this._strokeWidth = wd }
  208. /**
  209. *
  210. */
  211. public function SVGPath(svgNode:XML) {
  212. this._commands = [];
  213. this._points = [];
  214. this._bounds = new Rectangle();
  215. this._bounds.top = this._bounds.left = Number.MAX_VALUE;
  216. this._bounds.bottom = this._bounds.right = Number.MIN_VALUE;
  217. this._hasFill = false;
  218. this._hasStroke = false;
  220. this.makeDrawCmds(this.extractCmds(svgNode));
  221. }
  223. /**
  224. * @method extractCmds ()
  225. * @param node (XMLNode) SVG path node
  226. * @description Parse path node and convert to array of SVG drawing commands and data
  227. * eg, M,250.8,33.8,c,-33.6,-9.7,-42,19.1,-48.2,22.6,s,-27.9,2.2,-33.3,5.8,
  228. * c,-5.3,3.5,-17.3,23.5,-8.4,41.6
  229. * @returns (Array) array of drawing commands
  230. */
  231. private function extractCmds(node:XML):Array {
  232. var i:Number;
  233. var startColor:Number;
  234. var thisColor:Number;
  236. //var hasFill:Boolean = false;
  237. var hasTransform:Boolean = false;
  238. //var hasStroke:Boolean = false;
  239. var hasStrokeWidth:Boolean = false;
  240. var hasRotate:Number = 0;
  241. var dstring:String = "";
  242. var rotation:Number;
  244. // is there a fill attribute, a transform attribute, a stroke attribute?
  245. for each (var a:XML in node.attributes()) {
  246. switch (a.name().toString()) {
  247. case 'fill': this._hasFill = true; break;
  248. case 'transform': hasTransform = true; break;
  249. case 'stroke': this._hasStroke = true; break;
  250. case 'stroke-width': hasStrokeWidth = true; break;
  251. }
  252. }
  253. if (this._hasFill) {
  254. // parse for fill color specification
  255. // if a hex number is specified, startColor will be > 0
  256. // if a color name is specified, startColor will be 0
  257. var fillStr:String = node.@fill;
  258. if (fillStr == 'none') {
  259. this._hasFill = false;
  260. } else {
  261. startColor = fillStr.indexOf("#") + 1;
  262. if (startColor == 0) { // name specified instead of color number
  263. thisColor = SVGColor.getByName(fillStr);
  264. if (isNaN(thisColor)) {
  265. this._hasFill = false;
  266. } else {
  267. this._fillColor = thisColor;
  268. this._fillAlpha = 1.0;
  269. }
  270. } else {
  271. this._fillColor = parseInt(fillStr.substr(startColor, 6), 16);
  272. this._fillAlpha = 1.0;
  273. }
  274. }
  275. }
  277. // stroke: color, width, alpha
  278. if (this._hasStroke) {
  279. // parse for stroke color specification
  280. var strokeStr:String = node.@stroke;
  281. if (strokeStr == 'none') {
  282. this._hasStroke = false;
  283. } else {
  284. startColor = strokeStr.indexOf("#")+1;
  285. if (startColor == 0) { // name specified instead of color number
  286. thisColor = SVGColor.getByName(strokeStr);
  287. if (isNaN(thisColor)) {
  288. this._hasStroke = false;
  289. } else {
  290. this._strokeWidth = 0;
  291. this._strokeColor = SVGColor.getByName(strokeStr);
  292. this._strokeAlpha = 1.0;
  293. }
  294. } else {
  295. this._strokeWidth = 0;
  296. this._strokeColor = parseInt(strokeStr.substr(startColor,6),16);
  297. this._strokeAlpha = 1.0;
  298. }
  299. }
  300. }
  302. if (hasStrokeWidth) this._strokeWidth = Number(node.attribute("stroke-width"));
  304. // if stroke and fill are both undefined, set fill to black
  305. if (!this._hasFill && !this._hasStroke) {
  306. this._hasFill = true;
  307. this._fillColor = 0;
  308. this._fillAlpha = 1.0;
  309. }
  311. if (hasTransform) {
  312. // parse for rotation specification
  313. var transformStr:String = node.@transform;
  314. hasRotate = transformStr.indexOf("rotate");
  315. if (hasRotate > -1) {
  316. var startRotate:Number = transformStr.indexOf("(");
  317. var endRotate:Number = transformStr.indexOf(")");
  318. rotation = parseInt(transformStr.substr(startRotate+1, endRotate-startRotate));
  319. } else {
  320. rotation = 0;
  321. }
  323. } else rotation = 0;
  325. // if commas included, is it Adobe Illustrator (no spaces) or SVG Factory/other?
  326. dstring = node.@d;
  327. if (dstring.indexOf(",") > -1) { // has commas?
  328. if (dstring.indexOf(" ") > -1) { // yes, has spaces?
  329. // change spaces to commas, then deal as for Illustrator
  330. dstring = String2.replace(dstring," ",",");
  331. }
  332. } else { // no commas
  333. // get rid of extra spaces and change rest to commas
  334. dstring = String2.shrinkSequencesOf(dstring, " ");
  335. dstring = String2.replace(dstring, " ",",");
  336. }
  337. dstring = String2.replace(dstring, "c",",c,");
  338. dstring = String2.replace(dstring, "C",",C,");
  339. dstring = String2.replace(dstring, "S",",S,");
  340. dstring = String2.replace(dstring, "s",",s,");
  341. // separate the z from the last element
  342. dstring = String2.replace(dstring, "z",",z");
  343. // change the following if M can be mid-path
  344. dstring = String2.replace(dstring, "M","M,");
  345. dstring = String2.replace(dstring, "L",",L,");
  346. dstring = String2.replace(dstring, "l",",l,");
  347. dstring = String2.replace(dstring, "H",",H,");
  348. dstring = String2.replace(dstring, "h",",h,");
  349. dstring = String2.replace(dstring, "V",",V,");
  350. dstring = String2.replace(dstring, "v",",v,");
  351. dstring = String2.replace(dstring, "Q",",Q,");
  352. dstring = String2.replace(dstring, "q",",q,");
  353. dstring = String2.replace(dstring, "T",",T,");
  354. dstring = String2.replace(dstring, "t",",t,");
  355. // Adobe includes no delimiter before negative numbers
  356. dstring = String2.replace(dstring, "-",",-");
  357. // get rid of any dup commas we might have introduced
  358. dstring = String2.replace(dstring, ",,",",");
  359. // get rid of spaces
  360. // (cr/lf's have to be removed before the xml object can be created,
  361. // so that is done in xml.onData method)
  362. dstring = String2.replace(dstring, " ","");
  363. dstring = String2.replace(dstring, "\t","");
  365. return dstring.split(",");
  366. }
  368. /**
  369. * @method makeDrawCmds
  370. * @param svgCmds (Array) array of svg draw commands (as output from extractCmds)
  371. * @description Convert svg draw commands to array of ASVDrawing commands: _commands
  372. */
  373. private function makeDrawCmds(svgCmds:Array):void {
  374. var j:Number = 0, ii:int;
  375. var qc:Array;
  376. var firstP:Point;
  377. var lastP:Point;
  378. var lastC:Point;
  379. var cmd:String;
  380. var cp:Point, pp:Point;
  382. do {
  383. cmd = svgCmds[j++];
  384. switch (cmd) {
  385. case "M" :
  386. // moveTo point
  387. firstP = lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  388. if (this._hasFill) {
  389. _commands.push(new BeginFillCommand(this._fillColor, this._fillAlpha));
  390. }
  391. if (this._hasStroke) {
  392. _commands.push(new LineStyleCommand(this._strokeWidth, this._strokeColor, this._strokeAlpha));
  393. }
  394. _commands.push(new MoveToCommand(firstP));
  395. this.addPoint(firstP);
  396. j += 2;
  397. if (j < svgCmds.length && !isNaN(Number(svgCmds[j]))) {
  398. do {
  399. // if multiple points listed, add the rest as lineTo points
  400. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  401. _commands.push(new LineToCommand(lastP));
  402. this.addPoint(lastP);
  403. firstP = lastP;
  404. j += 2;
  405. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  406. }
  407. break;
  409. case "l" :
  410. do {
  411. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  412. _commands.push(new LineToCommand(lastP));
  413. this.addPoint(lastP);
  414. firstP = lastP;
  415. j += 2;
  416. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  417. break;
  419. case "L" :
  420. do {
  421. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  422. _commands.push(new LineToCommand(lastP));
  423. this.addPoint(lastP);
  424. firstP = lastP;
  425. j += 2;
  426. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  427. break;
  429. case "h" :
  430. do {
  431. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y);
  432. _commands.push(new LineToCommand(lastP));
  433. this.addPoint(lastP);
  434. firstP = lastP;
  435. j += 1;
  436. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  437. break;
  439. case "H" :
  440. do {
  441. lastP = new Point(Number(svgCmds[j]), lastP.y);
  442. _commands.push(new LineToCommand(lastP));
  443. this.addPoint(lastP);
  444. firstP = lastP;
  445. j += 1;
  446. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  447. break;
  449. case "v" :
  450. do {
  451. lastP = new Point(lastP.x, lastP.y+Number(svgCmds[j]));
  452. _commands.push(new LineToCommand(lastP));
  453. this.addPoint(lastP);
  454. firstP = lastP;
  455. j += 1;
  456. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  457. break;
  459. case "V" :
  460. do {
  461. lastP = new Point(lastP.x, Number(svgCmds[j]));
  462. _commands.push(new LineToCommand(lastP));
  463. this.addPoint(lastP);
  464. firstP = lastP;
  465. j += 1;
  466. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  467. break;
  469. case "q" :
  470. do {
  471. // control is relative to lastP, not lastC
  472. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  473. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  474. _commands.push(new CurveToCommand(lastC, lastP));
  475. this.addPoint(lastC, lastP);
  476. firstP = lastP;
  477. j += 4;
  478. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  479. break;
  481. case "Q" :
  482. do {
  483. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  484. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  485. _commands.push(new CurveToCommand(lastC, lastP));
  486. this.addPoint(lastC, lastP);
  487. firstP = lastP;
  488. j += 4;
  489. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  490. break;
  492. case "c" :
  493. do {
  494. // don't save if c1.x=c1.y=c2.x=c2.y=0
  495. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  496. } else {
  497. qc = [];
  498. Math2.getQuadBez_RP(
  499. {x:lastP.x, y:lastP.y},
  500. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  501. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  502. {x:lastP.x+Number(svgCmds[j+4]), y:lastP.y+Number(svgCmds[j+5])},
  503. 1, qc);
  504. for (ii=0; ii
  505. cp = new Point(qc[ii].cx, qc[ii].cy);
  506. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  507. _commands.push(new CurveToCommand(cp, pp));
  508. this.addPoint(cp, pp);
  509. }
  510. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  511. lastP = new Point(lastP.x+Number(svgCmds[j+4]), lastP.y+Number(svgCmds[j+5]));
  512. this.addPoint(lastC, lastP);
  513. firstP = lastP;
  514. }
  515. j += 6;
  516. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  517. break;
  519. case "C" :
  520. do {
  521. // don't save if c1.x=c1.y=c2.x=c2.y=0
  522. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  523. } else {
  524. qc = [];
  525. Math2.getQuadBez_RP(
  526. {x:firstP.x, y:firstP.y},
  527. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  528. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  529. {x:Number(svgCmds[j+4]), y:Number(svgCmds[j+5])},
  530. 1, qc);
  531. for (ii=0; ii
  532. cp = new Point(qc[ii].cx, qc[ii].cy);
  533. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  534. _commands.push(new CurveToCommand(cp, pp));
  535. this.addPoint(cp, pp);
  536. }
  537. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  538. lastP = new Point(Number(svgCmds[j+4]), Number(svgCmds[j+5]));
  539. this.addPoint(lastC, lastP);
  540. firstP = lastP;
  541. }
  542. j += 6;
  543. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  544. break;
  546. case "s" :
  547. do {
  548. // don't save if c1.x=c1.y=c2.x=c2.y=0
  549. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  550. } else {
  551. qc = [];
  552. Math2.getQuadBez_RP(
  553. {x:firstP.x, y:firstP.y},
  554. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  555. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  556. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  557. 1, qc);
  558. for (ii=0; ii
  559. cp = new Point(qc[ii].cx, qc[ii].cy);
  560. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  561. _commands.push(new CurveToCommand(cp, pp));
  562. this.addPoint(cp, pp);
  563. }
  564. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  565. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  566. this.addPoint(lastC, lastP);
  567. firstP = lastP;
  568. }
  569. j += 4;
  570. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  571. break;
  573. case "S" :
  574. do {
  575. // don't save if c1.x=c1.y=c2.x=c2.y=0
  576. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  577. } else {
  578. qc = [];
  579. Math2.getQuadBez_RP(
  580. {x:firstP.x, y:firstP.y},
  581. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  582. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  583. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  584. 1, qc);
  585. for (ii=0; ii
  586. cp = new Point(qc[ii].cx, qc[ii].cy);
  587. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  588. _commands.push(new CurveToCommand(cp, pp));
  589. this.addPoint(cp, pp);
  590. }
  591. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  592. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  593. this.addPoint(lastC, lastP);
  594. firstP = lastP;
  595. }
  596. j += 4;
  597. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  598. break;
  600. case "z" :
  601. case "Z" :
  602. if (!firstP.equals(lastP)) {
  603. _commands.push(new LineToCommand(firstP));
  604. this.addPoint(firstP);
  605. }
  606. j++;
  607. break;
  609. } // end switch
  610. } while (j < svgCmds.length);
  611. }
  613. /**
  614. *
  615. */
  616. public function draw(graphics:Graphics):void {
  617. for each (var command:SVGPathCommand in this._commands) {
  618. command.execute(graphics);
  619. }
  620. }
  622. }
  626. class String2 {
  628. /**
  629. * @class String2
  630. * @author Helen Triolo, with inclusions from Tim Groleau
  631. * @description String functions not included in String needed for path->array conversion
  632. */
  634. /**
  635. * @method replace ()
  636. * @description Replaces sFind in s with sReplace
  637. * @param s (String) original string
  638. * @param sFind (String) part to be replaced
  639. * @param sReplace (String) string to replace it with
  640. * @returns (String) string with replacement
  641. */
  642. public static function replace(s:String, sFind:String, sReplace:String):String {
  643. return s.split(sFind).join(sReplace);
  644. }
  646. /**
  647. * @method shrinkSequencesOf (Groleau)
  648. * @description Shrinks all sequences of a given character in a string to one
  649. * @param s (String) original string
  650. * @param ch (String) character to be found
  651. * @returns (String) string with sequences shrunk
  652. */
  653. public static function shrinkSequencesOf(s:String, ch:String):String {
  654. var len:Number = s.length;
  655. var idx:Number = 0;
  656. var idx2:Number = 0;
  657. var rs:String = "";
  659. while ((idx2 = s.indexOf(ch, idx) + 1) != 0) {
  660. // include string up to first character in sequence
  661. rs += s.substring(idx, idx2);
  662. idx = idx2;
  664. // remove all subsequent characters in sequence
  665. while ((s.charAt(idx) == ch) && (idx < len)) idx++;
  666. }
  667. return rs + s.substring(idx, len);
  668. }
  669. }
  672. class Math2 {
  674. /**
  675. * @class Math2
  676. * @author Helen Triolo, with inclusions from Robert Penner, Tim Groleau
  677. * @description Math functions not included in Math needed for path->array conversion
  678. */
  680. /**
  681. * @method ratioTo (Groleau)
  682. * @description Returns the point on segment [p1,p2] which is ratio times the total distance
  683. * between p1 and p2 away from p1
  684. * @param p1 (Object) x and y values of point p1
  685. * @param p2 (Object) x and y values of point p2
  686. * @param ratio (Number) real
  687. * @returns Object
  688. */
  689. public static function ratioTo(p1:Object, p2:Object, ratio:Number):Object {
  690. return {x:p1.x + (p2.x - p1.x) * ratio, y:p1.y + (p2.y - p1.y) * ratio };
  691. }
  693. /**
  694. * @method intersect2Lines (Penner)
  695. * @description Returns the point of intersection between two lines
  696. * @param p1, p2 (Objects) points on line 1
  697. * @param p3, p4 (Objects) points on line 2
  698. * @returns Object (point of intersection)
  699. */
  700. public static function intersect2Lines (p1:Object, p2:Object, p3:Object, p4:Object):Object {
  701. var x1:Number = p1.x; var y1:Number = p1.y;
  702. var x4:Number = p4.x; var y4:Number = p4.y;
  703. var dx1:Number = p2.x - x1;
  704. var dx2:Number = p3.x - x4;
  706. if (!(dx1 || dx2)) return NaN;
  707. var m1:Number = (p2.y - y1) / dx1;
  708. var m2:Number = (p3.y - y4) / dx2;
  709. if (!dx1) {
  710. return { x:x1, y:m2 * (x1 - x4) + y4 };
  711. } else if (!dx2) {
  712. return { x:x4, y:m1 * (x4 - x1) + y1 };
  713. }
  714. var xInt:Number = (-m2 * x4 + y4 + m1 * x1 - y1) / (m1 - m2);
  715. var yInt:Number = m1 * (xInt - x1) + y1;
  716. return { x:xInt,y:yInt };
  717. }
  719. /**
  720. * @method rotation
  721. * @description Returns the angle in degrees from the horizontal to a point dy up and dx over
  722. * @param dy (Number) pixels
  723. * @param dx (Number) pixels
  724. * @returns Number (angle, degrees)
  725. */
  726. public static function rotation(dy:Number, dx:Number):Number {
  727. return Math.atan2(dy, dx) * 180/Math.PI;
  728. }
  730. /**
  731. * @method midPt
  732. * @description Returns the midpoint (x/y) of a line segment from p1x/p1y to p2x/p2y
  733. * @param p1x (Number) pixels
  734. * @param p1y (Number) pixels
  735. * @param p2x (Number) pixels
  736. * @param p2y (Number) pixels
  737. * @returns Object (midpoint)
  738. */
  739. public static function midPt(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Object {
  740. return {x:(p1x + p2x)/2, y:(p1y + p2y)/2};
  741. }
  743. /**
  744. * @method getQuadBez_RP (Penner)
  745. * @description Approximates a cubic bezier with as many quadratic bezier segments (n) as required
  746. * to achieve a specified tolerance
  747. * @param p1 (Object) endpoint
  748. * @param c1 (Object) 1st control point
  749. * @param c2 (Object) 2nd control point
  750. * @param p2 (Object) endpoint
  751. * @param k: tolerance (low number = most accurate result)
  752. * @param qcurves (Array) will contain array of quadratic bezier curves, each element containing
  753. * p1x, p1y, cx, cy, p2x, p2y
  754. */
  755. public static function getQuadBez_RP(p1:Object, c1:Object, c2:Object, p2:Object, k:Number, qcurves:Array):void {
  756. // find intersection between bezier arms
  757. var s:Object = Math2.intersect2Lines (p1, c1, c2, p2);
  758. // find distance between the midpoints
  759. var dx:Number = (p1.x + p2.x + s.x * 4 - (c1.x + c2.x) * 3) * .125;
  760. var dy:Number = (p1.y + p2.y + s.y * 4 - (c1.y + c2.y) * 3) * .125;
  761. // split curve if the quadratic isn't close enough
  762. if (dx*dx + dy*dy > k) {
  763. var halves:Object = Math2.bezierSplit (p1.x, p1.y, c1.x, c1.y, c2.x, c2.y, p2.x, p2.y);
  764. var b0:Object = halves.b0; var b1:Object = halves.b1;
  765. // recursive call to subdivide curve
  766. getQuadBez_RP (p1, b0.c1, b0.c2, b0.p2, k, qcurves);
  767. getQuadBez_RP (b1.p1, b1.c1, b1.c2, p2, k, qcurves);
  768. } else {
  769. // end recursion by saving points
  770. qcurves.push({p1x:p1.x, p1y:p1.y, cx:s.x, cy:s.y, p2x:p2.x, p2y:p2.y});
  771. }
  772. }
  774. /**
  775. * @method bezierSplit (Penner)
  776. * @description Divides a cubic bezier curve into two halves (each also cubic beziers)
  777. * @param p1x (Number) pixels, endpoint 1
  778. * @param p1y (Number) pixels
  779. * @param c1x (Number) pixels, control point 1
  780. * @param c1y (Number) pixels
  781. * @param c2x (Number) pixels, control point 2
  782. * @param c2y (Number) pixels
  783. * @param p2x (Number) pixels, endpoint 2
  784. * @param p2y (Number) pixels
  785. * @returns Object (object with two cubic bezier definitions, b0 and b1)
  786. */
  787. public static function bezierSplit(p1x:Number, p1y:Number, c1x:Number, c1y:Number, c2x:Number, c2y:Number, p2x:Number, p2y:Number):Object {
  788. var m:Function = Math2.midPt;
  789. var p1:Object = {x:p1x, y:p1y};
  790. var p2:Object = {x:p2x, y:p2y};
  791. var p01:Object = m (p1x, p1y, c1x, c1y);
  792. var p12:Object = m (c1x, c1y, c2x, c2y);
  793. var p23:Object = m (c2x, c2y, p2x, p2y);
  794. var p02:Object = m (p01.x, p01.y, p12.x, p12.y);
  795. var p13:Object = m (p12.x, p12.y, p23.x, p23.y);
  796. var p03:Object = m (p02.x, p02.y, p13.x, p13.y);
  798. /*
  799. b0:{a:p0, b:p01, c:p02, d:p03},
  800. b1:{a:p03, b:p13, c:p23, d:p3 }
  801. */
  803. return { b0:{p1:p1, c1:p01, c2:p02, p2:p03}, b1:{p1:p03, c1:p13, c2:p23, p2:p2} };
  804. }
  806. /**
  807. * @method pointOnCurve (Penner)
  808. * @description Returns a point on a quadratic bezier curve with Robert Penner's optimization
  809. * of the standard equation:
  810. * {x:p1x * (1-t) * (1-t) + 2 * cx * t * (1-t) + p2x * t * t,
  811. * y:p1y * (1-t) * (1-t) + 2 * cy * t * (1-t) + p2y * t * t }
  812. * @param p1x (Number) pixels, endpoint 1
  813. * @param p1y (Number) pixels
  814. * @param cx (Number) pixels, control point
  815. * @param cy (Number) pixels
  816. * @param p2x (Number) pixels, endpoint 2
  817. * @param p2y (Number) pixels
  818. * @param t (Number) if time is 0-1 along curve, value of t to find point at
  819. * @returns Object (point at time t)
  820. */
  821. public static function pointOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, t:Number):Object {
  822. var o:Object = new Object();
  823. o.x = p1x + t*(2*(1-t)*(cx-p1x) + t*(p2x - p1x));
  824. o.y = p1y + t*(2*(1-t)*(cy-p1y) + t*(p2y - p1y));
  825. return o;
  826. }
  828. /**
  829. * @method pointsOnCurve (Penner)
  830. * @description Returns an array of objects defining points on a quadratic bezier curve, each of which
  831. * includes:
  832. * x,y = location of point defining start of segment
  833. * r = rotation of segment (last entry has none because it's just a point)
  834. * n = number of subdivisions into which curve will be divided (pts = n+1)
  835. * @param p1x (Number) pixels, endpoint 1
  836. * @param p1y (Number) pixels
  837. * @param cx (Number) pixels, control point
  838. * @param cy (Number) pixels
  839. * @param p2x (Number) pixels, endpoint 2
  840. * @param p2y (Number) pixels
  841. * @param n (Number) number of points to return
  842. * @returns Array
  843. */
  844. public static function pointsOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, n:Number):Array {
  845. var pts:Array = [];
  846. for (var i:Number=0; i <= n; i++) {
  847. pts.push(Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, i/n));
  848. if (i > 0) {
  849. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  850. }
  851. }
  852. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  853. return pts;
  854. }
  856. /**
  857. * @method pointsOnLine (Penner)
  858. * @description Returns an array of point positions and rotations for n evenly spaced points
  859. * along a line segment
  860. * x,y = location of point defining start of segment
  861. * r = rotation of segment (last entry has none because it's just a point)
  862. * n = number of subdivisions into which curve will be divided (pts = n+1)
  863. * @param p1x (Number) pixels, endpoint 1
  864. * @param p1y (Number) pixels
  865. * @param p2x (Number) pixels, endpoint 2
  866. * @param p2y (Number) pixels
  867. * @param n (Number) number of points to return
  868. * @returns Array
  869. *//* ....................................................................
  870. Returns an array of point positions and rotation for n evenly spaced points along a line segment
  871. */
  872. public static function pointsOnLine(p1x:Number, p1y:Number, p2x:Number, p2y:Number, n:Number):Array {
  873. var pts:Array = [];
  874. if (p2x != p1x) {
  875. var m:Number = (p2y-p1y)/(p2x-p1x);
  876. var b:Number = p1y - p1x * m;
  877. for (var i:Number=0; i <= n; i++) {
  878. var x:Number = p1x + ((p2x-p1x)/n) * i;
  879. pts.push({x:x, y:m*x+b});
  880. if (i > 0) {
  881. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  882. }
  883. }
  884. // vertical segment
  885. } else {
  886. for (i=0; i<=n; i++) {
  887. pts.push({x:p1x, y:p1y + ((p2y-p1y)/n) * i, r:90});
  888. }
  889. }
  890. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  891. return pts;
  892. }
  894. /**
  895. * @method curveApproxLen
  896. * @description Returns the approximate length of a curved segment, found by dividing it
  897. * into two segments at t=0.5
  898. * @param p1x (Number) pixels, endpoint 1
  899. * @param p1y (Number) pixels
  900. * @param cx (Number) pixels, control point
  901. * @param cy (Number) pixels
  902. * @param p2x (Number) pixels, endpoint 2
  903. * @param p2y (Number) pixels
  904. * @returns Number
  905. */
  906. public static function curveApproxLen(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number):Number {
  907. var mp:Object = Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, 0.5);
  908. var len1:Number = Math.sqrt((mp.x - p1x) * (mp.x - p1x) + (mp.y - p1y) * (mp.y - p1y));
  909. var len2:Number = Math.sqrt((mp.x - p2x) * (mp.x - p2x) + (mp.y - p2y) * (mp.y - p2y));
  910. return len1+len2;
  911. }
  913. /**
  914. * @method lineLen
  915. * @description Returns the length of a line segment
  916. * @param p1x (Number) pixels, endpoint 1
  917. * @param p1y (Number) pixels
  918. * @param p2x (Number) pixels, endpoint 2
  919. * @param p2y (Number) pixels
  920. * @returns Number
  921. */
  922. public static function lineLen(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Number {
  923. return Math.sqrt((p2x - p1x) * (p2x - p1x) + (p2y - p1y) * (p2y - p1y));
  924. }
  926. /**
  927. * @method roundTo
  928. * @description Returns a number rounded to specified number of decimals
  929. * @param n (Number)
  930. * @param ndec (Number) number of decimals to round to
  931. * @returns Number
  932. */
  933. public static function roundTo(n:Number, ndec:Number):Number {
  934. var multiplier:Number = Math.pow(10, ndec);
  935. return Math.round(n*multiplier)/multiplier;
  936. }
  937. }
  941. class SVGColor {
  943. public static function getByName(name:String):Number {
  944. var col:Number = SVGColor._colorTable[name];
  945. return isNaN(col) ? 0 : col;
  946. }
  948. private static const _colorTable:Object = {
  949. blue:0x0000ff,
  950. green:0x008000,
  951. red:0xff0000,
  952. aliceblue:0xf0f8ff,
  953. antiquewhite:0xfaebd7,
  954. aqua:0x00ffff,
  955. aquamarine:0x7fffd4,
  956. azure:0xf0ffff,
  957. beige:0xf5f5dc,
  958. bisque:0xffe4c4,
  959. black:0x000000,
  960. blanchedalmond:0xffebcd,
  961. blueviolet:0x8a2be2,
  962. brown:0xa52a2a,
  963. burlywood:0xdeb887,
  964. cadetblue:0x5f9ea0,
  965. chartreuse:0x7fff00,
  966. chocolate:0xd2691e,
  967. coral:0xff7f50,
  968. cornflowerblue:0x6495ed,
  969. cornsilk:0xfff8dc,
  970. crimson:0xdc143c,
  971. cyan:0x00ffff,
  972. darkblue:0x00008b,
  973. darkcyan:0x008b8b,
  974. darkgoldenrod:0xb8860b,
  975. darkgray:0xa9a9a9,
  976. darkgreen:0x006400,
  977. darkgrey:0xa9a9a9,
  978. darkkhaki:0xbdb76b,
  979. darkmagenta:0x8b008b,
  980. darkolivegreen:0x556b2f,
  981. darkorange:0xff8c00,
  982. darkorchid:0x9932cc,
  983. darkred:0x8b0000,
  984. darksalmon:0xe9967a,
  985. darkseagreen:0x8fbc8f,
  986. darkslateblue:0x483d8b,
  987. darkslategray:0x2f4f4f,
  988. darkslategrey:0x2f4f4f,
  989. darkturquoise:0x00ced1,
  990. darkviolet:0x9400d3,
  991. deeppink:0xff1493,
  992. deepskyblue:0x00bfff,
  993. dimgray:0x696969,
  994. dimgrey:0x696969,
  995. dodgerblue:0x1e90ff,
  996. firebrick:0xb22222,
  997. floralwhite:0xfffaf0,
  998. forestgreen:0x228b22,
  999. fuchsia:0xff00ff,
  1000. gainsboro:0xdcdcdc,
  1001. ghostwhite:0xf8f8ff,
  1002. gold:0xffd700,
  1003. goldenrod:0xdaa520,
  1004. gray:0x808080,
  1005. grey:0x808080,
  1006. greenyellow:0xadff2f,
  1007. honeydew:0xf0fff0,
  1008. hotpink:0xff69b4,
  1009. indianred:0xcd5c5c,
  1010. indigo:0x4b0082,
  1011. ivory:0xfffff0,
  1012. khaki:0xf0e68c,
  1013. lavender:0xe6e6fa,
  1014. lavenderblush:0xfff0f5,
  1015. lawngreen:0x7cfc00,
  1016. lemonchiffon:0xfffacd,
  1017. lightblue:0xadd8e6,
  1018. lightcoral:0xf08080,
  1019. lightcyan:0xe0ffff,
  1020. lightgoldenrodyellow:0xfafad2,
  1021. lightgray:0xd3d3d3,
  1022. lightgreen:0x90ee90,
  1023. lightgrey:0xd3d3d3,
  1024. lightpink:0xffb6c1,
  1025. lightsalmon:0xffa07a,
  1026. lightseagreen:0x20b2aa,
  1027. lightskyblue:0x87cefa,
  1028. lightslategray:0x778899,
  1029. lightslategrey:0x778899,
  1030. lightsteelblue:0xb0c4de,
  1031. lightyellow:0xffffe0,
  1032. lime:0x00ff00,
  1033. limegreen:0x32cd32,
  1034. linen:0xfaf0e6,
  1035. magenta:0xff00ff,
  1036. maroon:0x800000,
  1037. mediumaquamarine:0x66cdaa,
  1038. mediumblue:0x0000cd,
  1039. mediumorchid:0xba55d3,
  1040. mediumpurple:0x9370db,
  1041. mediumseagreen:0x3cb371,
  1042. mediumslateblue:0x7b68ee,
  1043. mediumspringgreen:0x00fa9a,
  1044. mediumturquoise:0x48d1cc,
  1045. mediumvioletred:0xc71585,
  1046. midnightblue:0x191970,
  1047. mintcream:0xf5fffa,
  1048. mistyrose:0xffe4e1,
  1049. moccasin:0xffe4b5,
  1050. navajowhite:0xffdead,
  1051. navy:0x000080,
  1052. oldlace:0xfdf5e6,
  1053. olive:0x808000,
  1054. olivedrab:0x6b8e23,
  1055. orange:0xffa500,
  1056. orangered:0xff4500,
  1057. orchid:0xda70d6,
  1058. palegoldenrod:0xeee8aa,
  1059. palegreen:0x98fb98,
  1060. paleturquoise:0xafeeee,
  1061. palevioletred:0xdb7093,
  1062. papayawhip:0xffefd5,
  1063. peachpuff:0xffdab9,
  1064. peru:0xcd853f,
  1065. pink:0xffc0cb,
  1066. plum:0xdda0dd,
  1067. powderblue:0xb0e0e6,
  1068. purple:0x800080,
  1069. rosybrown:0xbc8f8f,
  1070. royalblue:0x4169e1,
  1071. saddlebrown:0x8b4513,
  1072. salmon:0xfa8072,
  1073. sandybrown:0xf4a460,
  1074. seagreen:0x2e8b57,
  1075. seashell:0xfff5ee,
  1076. sienna:0xa0522d,
  1077. silver:0xc0c0c0,
  1078. skyblue:0x87ceeb,
  1079. slateblue:0x6a5acd,
  1080. slategray:0x708090,
  1081. slategrey:0x708090,
  1082. snow:0xfffafa,
  1083. springgreen:0x00ff7f,
  1084. steelblue:0x4682b4,
  1085. tan:0xd2b48c,
  1086. teal:0x008080,
  1087. thistle:0xd8bfd8,
  1088. tomato:0xff6347,
  1089. turquoise:0x40e0d0,
  1090. violet:0xee82ee,
  1091. wheat:0xf5deb3,
  1092. white:0xffffff,
  1093. whitesmoke:0xf5f5f5,
  1094. yellow:0xffff00,
  1095. yellowgreen:0x9acd32
  1096. }
  1098. }
  1101. class SVGPathCommandType {
  1103. public static const BEGIN_FILL_COMMAND:Number = 1;
  1104. public static const LINE_STYLE_COMMAND:Number = 2;
  1105. public static const MOVE_TO_COMMAND:Number = 3;
  1106. public static const LINE_TO_COMMAND:Number = 4;
  1107. public static const CURVE_TO_COMMAND:Number = 5;
  1109. }
  1112. interface ISVGPathCommand {
  1114. function execute(graphics:Graphics):void;
  1116. }
  1119. class SVGPathCommand implements ISVGPathCommand {
  1121. private var _type:Number;
  1122. public function get type():Number { return this._type; }
  1124. public function SVGPathCommand(type:Number = 0) {
  1125. this._type = type;
  1126. }
  1128. public function execute(graphics:Graphics):void {
  1129. throw new Error('Subclass must be implement execute method.');
  1130. }
  1132. }
  1135. class BeginFillCommand extends SVGPathCommand {
  1137. private var _color:Number;
  1138. public function get color():Number { return this._color; }
  1140. private var _alpha:Number;
  1141. public function get alpha():Number { return this._alpha; }
  1143. public function BeginFillCommand(color:Number, alpha:Number) {
  1144. super(SVGPathCommandType.BEGIN_FILL_COMMAND);
  1145. this._color = color;
  1146. this._alpha = alpha;
  1147. }
  1149. public override function execute(graphics:Graphics):void {
  1150. graphics.beginFill(this._color, this._alpha);
  1151. }
  1153. }
  1156. class CurveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1158. private var _pt1:Point;
  1159. public function get x1():Number { return this._pt1.x; }
  1160. public function get y1():Number { return this._pt1.y; }
  1162. private var _pt2:Point;
  1163. public function get x2():Number { return this._pt2.x; }
  1164. public function get y2():Number { return this._pt2.y; }
  1166. public function CurveToCommand(pt1:Point, pt2:Point) {
  1167. super(SVGPathCommandType.CURVE_TO_COMMAND);
  1168. this._pt1 = pt1;
  1169. this._pt2 = pt2;
  1170. }
  1172. public override function execute(graphics:Graphics):void {
  1173. graphics.curveTo(this._pt1.x, this._pt1.y, this._pt2.x, this._pt2.y);
  1174. }
  1176. }
  1179. class LineStyleCommand extends SVGPathCommand implements ISVGPathCommand {
  1181. private var _width:Number;
  1182. public function get width():Number { return this._width; }
  1184. private var _color:Number;
  1185. public function get color():Number { return this._color; }
  1187. private var _alpha:Number;
  1188. public function get alpha():Number { return this._alpha; }
  1190. public function LineStyleCommand(width:Number, color:Number, alpha:Number) {
  1191. super(SVGPathCommandType.LINE_STYLE_COMMAND);
  1192. this._width = width;
  1193. this._color = color;
  1194. this._alpha = alpha;
  1195. }
  1197. public override function execute(graphics:Graphics):void {
  1198. graphics.lineStyle(this._width, this._color, this._alpha);
  1199. }
  1200. }
  1203. class LineToCommand extends SVGPathCommand implements ISVGPathCommand {
  1205. private var _pt:Point;
  1206. public function get x():Number { return this._pt.x; }
  1207. public function get y():Number { return this._pt.y; }
  1209. public function LineToCommand(pt:Point) {
  1210. super(SVGPathCommandType.LINE_TO_COMMAND);
  1211. this._pt = pt;
  1212. }
  1214. public override function execute(graphics:Graphics):void {
  1215. graphics.lineTo(this._pt.x, this._pt.y);
  1216. }
  1218. }
  1221. class MoveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1223. private var _pt:Point;
  1224. public function get x():Number { return this._pt.x; }
  1225. public function get y():Number { return this._pt.y; }
  1227. public function MoveToCommand(pt:Point) {
  1228. super(SVGPathCommandType.MOVE_TO_COMMAND);
  1229. this._pt = pt;
  1230. }
  1232. public override function execute(graphics:Graphics):void {
  1233. graphics.moveTo(this._pt.x, this._pt.y);
  1234. }
  1236. }
noswf

Sewing forked from: Sewing [diff(4)]

  1. // forked from Saqoosha's Sewing
  2. package {
  4. import caurina.transitions.Equations;
  5. import caurina.transitions.Tweener;
  6. import caurina.transitions.properties.CurveModifiers;
  8. import flash.display.Graphics;
  9. import flash.display.Sprite;
  10. import flash.display.StageAlign;
  11. import flash.display.StageQuality;
  12. import flash.display.StageScaleMode;
  13. import flash.events.Event;
  14. import flash.geom.Point;
  15. import flash.net.URLLoader;
  16. import flash.net.URLLoaderDataFormat;
  17. import flash.net.URLRequest;
  18. import flash.utils.setTimeout;
  20. [SWF(width=465, height=465, backgroundColor=0xffff00, frameRate=60)]
  22. public class Sewing extends Sprite {
  24. private var _loader:URLLoader;
  25. private var _canvas:Sprite;
  26. private var _paths:Array;
  28. public function Sewing() {
  29. //Wonderfl.capture_delay(58);
  31. //this.stage.quality = StageQuality.BEST;
  32. this.stage.align = StageAlign.TOP_LEFT;
  33. this.stage.scaleMode = StageScaleMode.NO_SCALE;
  35. CurveModifiers.init();
  37. this._canvas = this.addChild(new Sprite()) as Sprite;
  39. this._loader = new URLLoader();
  40. this._loader.dataFormat = URLLoaderDataFormat.TEXT;
  41. this._loader.addEventListener(Event.COMPLETE, this._handleLoaded);
  42. this._loader.load(new URLRequest('http://saqoosha.net/lab/wonderfl/saqoosha.svg'));
  43. }
  45. private function _handleLoaded(e:Event):void {
  46. var svg:XML = new XML(this._loader.data);
  47. this._paths = [];
  48. var path:SVGPath;
  49. var delay:Number = 2.0;
  50. var cx:Number = parseInt(svg.@width) / 2;
  51. var cy:Number = parseInt(svg.@height) / 2;
  52. this._canvas.x = this.stage.stageWidth / 2 - cx;
  53. this._canvas.y = this.stage.stageHeight / 2 - cy;
  54. for each (var pathNode:XML in svg..*::path) {
  55. path = new SVGPath(pathNode);
  56. this._paths.push(path);
  57. var i:Number = 0;
  58. var di:Number = Math.PI * 2 / path.points.length;
  59. var px:Number = cx;
  60. var py:Number = this.stage.stageHeight - this._canvas.y;
  61. for each (var pt:Point in path.points) {
  62. Tweener.addTween(pt, {
  63. x: pt.x,
  64. y: pt.y,
  65. _bezier:[
  66. { x:cx + Math.sin(delay * 1.3) * 300 + Math.sin(delay * 10.3) * 80, y:50 },
  67. { x:100 - Math.sin(delay * 7.2) * 80, y:50 }
  68. ],
  69. time: 1.0,
  70. delay: delay,
  71. transition: Equations.easeNone
  72. });
  73. pt.x = px;
  74. pt.y = py;
  75. delay += 0.004;
  76. i += di;
  77. }
  78. }
  79. this.addEventListener(Event.ENTER_FRAME, this._drawPaths);
  80. setTimeout(function ():void {
  81. removeEventListener(Event.ENTER_FRAME, _drawPaths);
  82. }, (delay + 1) * 1000);
  83. }
  85. private function _drawPaths(e:Event):void {
  86. this._canvas.graphics.clear();
  87. for each (var path:SVGPath in this._paths) {
  88. path.draw(this._canvas.graphics);
  89. }
  90. }
  91. }
  92. }
  108. import flash.display.Graphics;
  109. import flash.geom.Point;
  110. import flash.geom.Rectangle;
  113. /**
  114. * @class PathToArray
  115. * @author Helen Triolo (with contributions from many people)
  116. * @version 1.01
  117. * @description Takes as input an SVG Path node (eg, from Illustrator 10, SVG Factory, etc, but must
  118. * not contain any CRLF characters), and an empty array.
  119. * Parses the path node to make an array of drawing commands, which include cubic bezier
  120. * draw commands. Converts the cubic beziers to an array of equivalent quad beziers,
  121. * using Robert Penner's code to convert with accuracy within 1 pixel.
  122. * Drawing commands are produced in the format originally devised by Peter Hall
  123. * in his ASVDrawing class. These are the possible elements in array dCmds (and the
  124. * corresponding Flash drawing API commands to apply them):
  125. * ['M',[x,y]] moveTo(x,y)
  126. * ['L',[x,y]] lineTo(x,y)
  127. * ['C',[cx,cy,ax,ay]] moveTo(cx,cy,ax,ay)
  128. * ['S',[width,color,alpha]] lineStyle(widtb,color,alpha)
  129. * ['F',[color,alpha]] beginFill(color,alpha)
  130. * ['EF'] endFill()
  131. * History:
  132. * v1.00 2005/11/13 Original release
  133. * v1.01 2006/05/06 Stroke corrected to stroke, line 250 (thanks Gábor Szabó)
  134. *
  135. * @param svgnode (XMLNode) Path node from SVG file
  136. * @param dCmds (Array) Empty array to write commands to
  137. */
  139. class SVGPath {
  141. private var _commands:Array;
  142. public function get commands():Array { return this._commands }
  144. private var _points:Array;
  145. public function get points():Array { return this._points }
  146. private function addPoint(... points:Array):void {
  147. for each (var pt:Point in points) {
  148. this._addPoint(pt);
  149. }
  150. }
  151. private function _addPoint(pt:Point):void {
  152. if (pt.x < this._bounds.left) {
  153. this._bounds.left = pt.x;
  154. } else if (this._bounds.right < pt.x) {
  155. this._bounds.right = pt.x;
  156. }
  157. if (pt.y < this._bounds.top) {
  158. this._bounds.top = pt.y;
  159. } else if (this._bounds.bottom < pt.y) {
  160. this._bounds.bottom = pt.y;
  161. }
  162. this._points.push(pt);
  163. }
  165. private var _bounds:Rectangle;
  166. public function get boundsRect():Rectangle { return this._bounds }
  168. private var _hasFill:Boolean;
  169. public function get hasFill():Boolean { return this._hasFill }
  171. private var _hasStroke:Boolean;
  172. public function get hasStroke():Boolean { return this._hasStroke }
  174. public function swapFillAndStroke():void {
  175. var flg:Boolean = this._hasFill;
  176. this._hasFill = this._hasStroke;
  177. this._hasStroke = flg;
  179. var val:Number = this._fillColor;
  180. this._fillColor = this._strokeColor;
  181. this._strokeColor = val;
  183. val = this._fillAlpha;
  184. this._fillAlpha = this._strokeAlpha;
  185. this._strokeAlpha = val;
  186. }
  188. private var _fillColor:Number;
  189. public function get fillColor():Number { return this._fillColor }
  190. public function set fillColor(col:Number):void { this._fillColor = col }
  192. private var _fillAlpha:Number;
  193. public function get fillAlpha():Number { return this._fillAlpha }
  194. public function set fillAlpha(al:Number):void { this._fillAlpha = al }
  196. private var _strokeColor:Number;
  197. public function get strokeColor():Number { return this._strokeColor }
  198. public function set strokeColor(col:Number):void { this._strokeColor = col }
  200. private var _strokeAlpha:Number;
  201. public function get strokeAlpha():Number { return this._strokeAlpha }
  202. public function set strokeAlpha(al:Number):void { this._strokeAlpha = al }
  204. private var _strokeWidth:Number;
  205. public function get strokeWidth():Number { return this._strokeWidth }
  206. public function set strokeWidth(wd:Number):void { this._strokeWidth = wd }
  208. /**
  209. *
  210. */
  211. public function SVGPath(svgNode:XML) {
  212. this._commands = [];
  213. this._points = [];
  214. this._bounds = new Rectangle();
  215. this._bounds.top = this._bounds.left = Number.MAX_VALUE;
  216. this._bounds.bottom = this._bounds.right = Number.MIN_VALUE;
  217. this._hasFill = false;
  218. this._hasStroke = false;
  220. this.makeDrawCmds(this.extractCmds(svgNode));
  221. }
  223. /**
  224. * @method extractCmds ()
  225. * @param node (XMLNode) SVG path node
  226. * @description Parse path node and convert to array of SVG drawing commands and data
  227. * eg, M,250.8,33.8,c,-33.6,-9.7,-42,19.1,-48.2,22.6,s,-27.9,2.2,-33.3,5.8,
  228. * c,-5.3,3.5,-17.3,23.5,-8.4,41.6
  229. * @returns (Array) array of drawing commands
  230. */
  231. private function extractCmds(node:XML):Array {
  232. var i:Number;
  233. var startColor:Number;
  234. var thisColor:Number;
  236. //var hasFill:Boolean = false;
  237. var hasTransform:Boolean = false;
  238. //var hasStroke:Boolean = false;
  239. var hasStrokeWidth:Boolean = false;
  240. var hasRotate:Number = 0;
  241. var dstring:String = "";
  242. var rotation:Number;
  244. // is there a fill attribute, a transform attribute, a stroke attribute?
  245. for each (var a:XML in node.attributes()) {
  246. switch (a.name().toString()) {
  247. case 'fill': this._hasFill = true; break;
  248. case 'transform': hasTransform = true; break;
  249. case 'stroke': this._hasStroke = true; break;
  250. case 'stroke-width': hasStrokeWidth = true; break;
  251. }
  252. }
  253. if (this._hasFill) {
  254. // parse for fill color specification
  255. // if a hex number is specified, startColor will be > 0
  256. // if a color name is specified, startColor will be 0
  257. var fillStr:String = node.@fill;
  258. if (fillStr == 'none') {
  259. this._hasFill = false;
  260. } else {
  261. startColor = fillStr.indexOf("#") + 1;
  262. if (startColor == 0) { // name specified instead of color number
  263. thisColor = SVGColor.getByName(fillStr);
  264. if (isNaN(thisColor)) {
  265. this._hasFill = false;
  266. } else {
  267. this._fillColor = thisColor;
  268. this._fillAlpha = 1.0;
  269. }
  270. } else {
  271. this._fillColor = parseInt(fillStr.substr(startColor, 6), 16);
  272. this._fillAlpha = 1.0;
  273. }
  274. }
  275. }
  277. // stroke: color, width, alpha
  278. if (this._hasStroke) {
  279. // parse for stroke color specification
  280. var strokeStr:String = node.@stroke;
  281. if (strokeStr == 'none') {
  282. this._hasStroke = false;
  283. } else {
  284. startColor = strokeStr.indexOf("#")+1;
  285. if (startColor == 0) { // name specified instead of color number
  286. thisColor = SVGColor.getByName(strokeStr);
  287. if (isNaN(thisColor)) {
  288. this._hasStroke = false;
  289. } else {
  290. this._strokeWidth = 0;
  291. this._strokeColor = SVGColor.getByName(strokeStr);
  292. this._strokeAlpha = 1.0;
  293. }
  294. } else {
  295. this._strokeWidth = 0;
  296. this._strokeColor = parseInt(strokeStr.substr(startColor,6),16);
  297. this._strokeAlpha = 1.0;
  298. }
  299. }
  300. }
  302. if (hasStrokeWidth) this._strokeWidth = Number(node.attribute("stroke-width"));
  304. // if stroke and fill are both undefined, set fill to black
  305. if (!this._hasFill && !this._hasStroke) {
  306. this._hasFill = true;
  307. this._fillColor = 0;
  308. this._fillAlpha = 1.0;
  309. }
  311. if (hasTransform) {
  312. // parse for rotation specification
  313. var transformStr:String = node.@transform;
  314. hasRotate = transformStr.indexOf("rotate");
  315. if (hasRotate > -1) {
  316. var startRotate:Number = transformStr.indexOf("(");
  317. var endRotate:Number = transformStr.indexOf(")");
  318. rotation = parseInt(transformStr.substr(startRotate+1, endRotate-startRotate));
  319. } else {
  320. rotation = 0;
  321. }
  323. } else rotation = 0;
  325. // if commas included, is it Adobe Illustrator (no spaces) or SVG Factory/other?
  326. dstring = node.@d;
  327. if (dstring.indexOf(",") > -1) { // has commas?
  328. if (dstring.indexOf(" ") > -1) { // yes, has spaces?
  329. // change spaces to commas, then deal as for Illustrator
  330. dstring = String2.replace(dstring," ",",");
  331. }
  332. } else { // no commas
  333. // get rid of extra spaces and change rest to commas
  334. dstring = String2.shrinkSequencesOf(dstring, " ");
  335. dstring = String2.replace(dstring, " ",",");
  336. }
  337. dstring = String2.replace(dstring, "c",",c,");
  338. dstring = String2.replace(dstring, "C",",C,");
  339. dstring = String2.replace(dstring, "S",",S,");
  340. dstring = String2.replace(dstring, "s",",s,");
  341. // separate the z from the last element
  342. dstring = String2.replace(dstring, "z",",z");
  343. // change the following if M can be mid-path
  344. dstring = String2.replace(dstring, "M","M,");
  345. dstring = String2.replace(dstring, "L",",L,");
  346. dstring = String2.replace(dstring, "l",",l,");
  347. dstring = String2.replace(dstring, "H",",H,");
  348. dstring = String2.replace(dstring, "h",",h,");
  349. dstring = String2.replace(dstring, "V",",V,");
  350. dstring = String2.replace(dstring, "v",",v,");
  351. dstring = String2.replace(dstring, "Q",",Q,");
  352. dstring = String2.replace(dstring, "q",",q,");
  353. dstring = String2.replace(dstring, "T",",T,");
  354. dstring = String2.replace(dstring, "t",",t,");
  355. // Adobe includes no delimiter before negative numbers
  356. dstring = String2.replace(dstring, "-",",-");
  357. // get rid of any dup commas we might have introduced
  358. dstring = String2.replace(dstring, ",,",",");
  359. // get rid of spaces
  360. // (cr/lf's have to be removed before the xml object can be created,
  361. // so that is done in xml.onData method)
  362. dstring = String2.replace(dstring, " ","");
  363. dstring = String2.replace(dstring, "\t","");
  365. return dstring.split(",");
  366. }
  368. /**
  369. * @method makeDrawCmds
  370. * @param svgCmds (Array) array of svg draw commands (as output from extractCmds)
  371. * @description Convert svg draw commands to array of ASVDrawing commands: _commands
  372. */
  373. private function makeDrawCmds(svgCmds:Array):void {
  374. var j:Number = 0, ii:int;
  375. var qc:Array;
  376. var firstP:Point;
  377. var lastP:Point;
  378. var lastC:Point;
  379. var cmd:String;
  380. var cp:Point, pp:Point;
  382. do {
  383. cmd = svgCmds[j++];
  384. switch (cmd) {
  385. case "M" :
  386. // moveTo point
  387. firstP = lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  388. if (this._hasFill) {
  389. _commands.push(new BeginFillCommand(this._fillColor, this._fillAlpha));
  390. }
  391. if (this._hasStroke) {
  392. _commands.push(new LineStyleCommand(this._strokeWidth, this._strokeColor, this._strokeAlpha));
  393. }
  394. _commands.push(new MoveToCommand(firstP));
  395. this.addPoint(firstP);
  396. j += 2;
  397. if (j < svgCmds.length && !isNaN(Number(svgCmds[j]))) {
  398. do {
  399. // if multiple points listed, add the rest as lineTo points
  400. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  401. _commands.push(new LineToCommand(lastP));
  402. this.addPoint(lastP);
  403. firstP = lastP;
  404. j += 2;
  405. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  406. }
  407. break;
  409. case "l" :
  410. do {
  411. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  412. _commands.push(new LineToCommand(lastP));
  413. this.addPoint(lastP);
  414. firstP = lastP;
  415. j += 2;
  416. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  417. break;
  419. case "L" :
  420. do {
  421. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  422. _commands.push(new LineToCommand(lastP));
  423. this.addPoint(lastP);
  424. firstP = lastP;
  425. j += 2;
  426. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  427. break;
  429. case "h" :
  430. do {
  431. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y);
  432. _commands.push(new LineToCommand(lastP));
  433. this.addPoint(lastP);
  434. firstP = lastP;
  435. j += 1;
  436. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  437. break;
  439. case "H" :
  440. do {
  441. lastP = new Point(Number(svgCmds[j]), lastP.y);
  442. _commands.push(new LineToCommand(lastP));
  443. this.addPoint(lastP);
  444. firstP = lastP;
  445. j += 1;
  446. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  447. break;
  449. case "v" :
  450. do {
  451. lastP = new Point(lastP.x, lastP.y+Number(svgCmds[j]));
  452. _commands.push(new LineToCommand(lastP));
  453. this.addPoint(lastP);
  454. firstP = lastP;
  455. j += 1;
  456. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  457. break;
  459. case "V" :
  460. do {
  461. lastP = new Point(lastP.x, Number(svgCmds[j]));
  462. _commands.push(new LineToCommand(lastP));
  463. this.addPoint(lastP);
  464. firstP = lastP;
  465. j += 1;
  466. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  467. break;
  469. case "q" :
  470. do {
  471. // control is relative to lastP, not lastC
  472. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  473. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  474. _commands.push(new CurveToCommand(lastC, lastP));
  475. this.addPoint(lastC, lastP);
  476. firstP = lastP;
  477. j += 4;
  478. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  479. break;
  481. case "Q" :
  482. do {
  483. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  484. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  485. _commands.push(new CurveToCommand(lastC, lastP));
  486. this.addPoint(lastC, lastP);
  487. firstP = lastP;
  488. j += 4;
  489. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  490. break;
  492. case "c" :
  493. do {
  494. // don't save if c1.x=c1.y=c2.x=c2.y=0
  495. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  496. } else {
  497. qc = [];
  498. Math2.getQuadBez_RP(
  499. {x:lastP.x, y:lastP.y},
  500. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  501. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  502. {x:lastP.x+Number(svgCmds[j+4]), y:lastP.y+Number(svgCmds[j+5])},
  503. 1, qc);
  504. for (ii=0; ii
  505. cp = new Point(qc[ii].cx, qc[ii].cy);
  506. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  507. _commands.push(new CurveToCommand(cp, pp));
  508. this.addPoint(cp, pp);
  509. }
  510. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  511. lastP = new Point(lastP.x+Number(svgCmds[j+4]), lastP.y+Number(svgCmds[j+5]));
  512. this.addPoint(lastC, lastP);
  513. firstP = lastP;
  514. }
  515. j += 6;
  516. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  517. break;
  519. case "C" :
  520. do {
  521. // don't save if c1.x=c1.y=c2.x=c2.y=0
  522. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  523. } else {
  524. qc = [];
  525. Math2.getQuadBez_RP(
  526. {x:firstP.x, y:firstP.y},
  527. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  528. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  529. {x:Number(svgCmds[j+4]), y:Number(svgCmds[j+5])},
  530. 1, qc);
  531. for (ii=0; ii
  532. cp = new Point(qc[ii].cx, qc[ii].cy);
  533. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  534. _commands.push(new CurveToCommand(cp, pp));
  535. this.addPoint(cp, pp);
  536. }
  537. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  538. lastP = new Point(Number(svgCmds[j+4]), Number(svgCmds[j+5]));
  539. this.addPoint(lastC, lastP);
  540. firstP = lastP;
  541. }
  542. j += 6;
  543. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  544. break;
  546. case "s" :
  547. do {
  548. // don't save if c1.x=c1.y=c2.x=c2.y=0
  549. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  550. } else {
  551. qc = [];
  552. Math2.getQuadBez_RP(
  553. {x:firstP.x, y:firstP.y},
  554. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  555. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  556. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  557. 1, qc);
  558. for (ii=0; ii
  559. cp = new Point(qc[ii].cx, qc[ii].cy);
  560. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  561. _commands.push(new CurveToCommand(cp, pp));
  562. this.addPoint(cp, pp);
  563. }
  564. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  565. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  566. this.addPoint(lastC, lastP);
  567. firstP = lastP;
  568. }
  569. j += 4;
  570. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  571. break;
  573. case "S" :
  574. do {
  575. // don't save if c1.x=c1.y=c2.x=c2.y=0
  576. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  577. } else {
  578. qc = [];
  579. Math2.getQuadBez_RP(
  580. {x:firstP.x, y:firstP.y},
  581. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  582. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  583. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  584. 1, qc);
  585. for (ii=0; ii
  586. cp = new Point(qc[ii].cx, qc[ii].cy);
  587. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  588. _commands.push(new CurveToCommand(cp, pp));
  589. this.addPoint(cp, pp);
  590. }
  591. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  592. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  593. this.addPoint(lastC, lastP);
  594. firstP = lastP;
  595. }
  596. j += 4;
  597. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  598. break;
  600. case "z" :
  601. case "Z" :
  602. if (!firstP.equals(lastP)) {
  603. _commands.push(new LineToCommand(firstP));
  604. this.addPoint(firstP);
  605. }
  606. j++;
  607. break;
  609. } // end switch
  610. } while (j < svgCmds.length);
  611. }
  613. /**
  614. *
  615. */
  616. public function draw(graphics:Graphics):void {
  617. for each (var command:SVGPathCommand in this._commands) {
  618. command.execute(graphics);
  619. }
  620. }
  622. }
  626. class String2 {
  628. /**
  629. * @class String2
  630. * @author Helen Triolo, with inclusions from Tim Groleau
  631. * @description String functions not included in String needed for path->array conversion
  632. */
  634. /**
  635. * @method replace ()
  636. * @description Replaces sFind in s with sReplace
  637. * @param s (String) original string
  638. * @param sFind (String) part to be replaced
  639. * @param sReplace (String) string to replace it with
  640. * @returns (String) string with replacement
  641. */
  642. public static function replace(s:String, sFind:String, sReplace:String):String {
  643. return s.split(sFind).join(sReplace);
  644. }
  646. /**
  647. * @method shrinkSequencesOf (Groleau)
  648. * @description Shrinks all sequences of a given character in a string to one
  649. * @param s (String) original string
  650. * @param ch (String) character to be found
  651. * @returns (String) string with sequences shrunk
  652. */
  653. public static function shrinkSequencesOf(s:String, ch:String):String {
  654. var len:Number = s.length;
  655. var idx:Number = 0;
  656. var idx2:Number = 0;
  657. var rs:String = "";
  659. while ((idx2 = s.indexOf(ch, idx) + 1) != 0) {
  660. // include string up to first character in sequence
  661. rs += s.substring(idx, idx2);
  662. idx = idx2;
  664. // remove all subsequent characters in sequence
  665. while ((s.charAt(idx) == ch) && (idx < len)) idx++;
  666. }
  667. return rs + s.substring(idx, len);
  668. }
  669. }
  672. class Math2 {
  674. /**
  675. * @class Math2
  676. * @author Helen Triolo, with inclusions from Robert Penner, Tim Groleau
  677. * @description Math functions not included in Math needed for path->array conversion
  678. */
  680. /**
  681. * @method ratioTo (Groleau)
  682. * @description Returns the point on segment [p1,p2] which is ratio times the total distance
  683. * between p1 and p2 away from p1
  684. * @param p1 (Object) x and y values of point p1
  685. * @param p2 (Object) x and y values of point p2
  686. * @param ratio (Number) real
  687. * @returns Object
  688. */
  689. public static function ratioTo(p1:Object, p2:Object, ratio:Number):Object {
  690. return {x:p1.x + (p2.x - p1.x) * ratio, y:p1.y + (p2.y - p1.y) * ratio };
  691. }
  693. /**
  694. * @method intersect2Lines (Penner)
  695. * @description Returns the point of intersection between two lines
  696. * @param p1, p2 (Objects) points on line 1
  697. * @param p3, p4 (Objects) points on line 2
  698. * @returns Object (point of intersection)
  699. */
  700. public static function intersect2Lines (p1:Object, p2:Object, p3:Object, p4:Object):Object {
  701. var x1:Number = p1.x; var y1:Number = p1.y;
  702. var x4:Number = p4.x; var y4:Number = p4.y;
  703. var dx1:Number = p2.x - x1;
  704. var dx2:Number = p3.x - x4;
  706. if (!(dx1 || dx2)) return NaN;
  707. var m1:Number = (p2.y - y1) / dx1;
  708. var m2:Number = (p3.y - y4) / dx2;
  709. if (!dx1) {
  710. return { x:x1, y:m2 * (x1 - x4) + y4 };
  711. } else if (!dx2) {
  712. return { x:x4, y:m1 * (x4 - x1) + y1 };
  713. }
  714. var xInt:Number = (-m2 * x4 + y4 + m1 * x1 - y1) / (m1 - m2);
  715. var yInt:Number = m1 * (xInt - x1) + y1;
  716. return { x:xInt,y:yInt };
  717. }
  719. /**
  720. * @method rotation
  721. * @description Returns the angle in degrees from the horizontal to a point dy up and dx over
  722. * @param dy (Number) pixels
  723. * @param dx (Number) pixels
  724. * @returns Number (angle, degrees)
  725. */
  726. public static function rotation(dy:Number, dx:Number):Number {
  727. return Math.atan2(dy, dx) * 180/Math.PI;
  728. }
  730. /**
  731. * @method midPt
  732. * @description Returns the midpoint (x/y) of a line segment from p1x/p1y to p2x/p2y
  733. * @param p1x (Number) pixels
  734. * @param p1y (Number) pixels
  735. * @param p2x (Number) pixels
  736. * @param p2y (Number) pixels
  737. * @returns Object (midpoint)
  738. */
  739. public static function midPt(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Object {
  740. return {x:(p1x + p2x)/2, y:(p1y + p2y)/2};
  741. }
  743. /**
  744. * @method getQuadBez_RP (Penner)
  745. * @description Approximates a cubic bezier with as many quadratic bezier segments (n) as required
  746. * to achieve a specified tolerance
  747. * @param p1 (Object) endpoint
  748. * @param c1 (Object) 1st control point
  749. * @param c2 (Object) 2nd control point
  750. * @param p2 (Object) endpoint
  751. * @param k: tolerance (low number = most accurate result)
  752. * @param qcurves (Array) will contain array of quadratic bezier curves, each element containing
  753. * p1x, p1y, cx, cy, p2x, p2y
  754. */
  755. public static function getQuadBez_RP(p1:Object, c1:Object, c2:Object, p2:Object, k:Number, qcurves:Array):void {
  756. // find intersection between bezier arms
  757. var s:Object = Math2.intersect2Lines (p1, c1, c2, p2);
  758. // find distance between the midpoints
  759. var dx:Number = (p1.x + p2.x + s.x * 4 - (c1.x + c2.x) * 3) * .125;
  760. var dy:Number = (p1.y + p2.y + s.y * 4 - (c1.y + c2.y) * 3) * .125;
  761. // split curve if the quadratic isn't close enough
  762. if (dx*dx + dy*dy > k) {
  763. var halves:Object = Math2.bezierSplit (p1.x, p1.y, c1.x, c1.y, c2.x, c2.y, p2.x, p2.y);
  764. var b0:Object = halves.b0; var b1:Object = halves.b1;
  765. // recursive call to subdivide curve
  766. getQuadBez_RP (p1, b0.c1, b0.c2, b0.p2, k, qcurves);
  767. getQuadBez_RP (b1.p1, b1.c1, b1.c2, p2, k, qcurves);
  768. } else {
  769. // end recursion by saving points
  770. qcurves.push({p1x:p1.x, p1y:p1.y, cx:s.x, cy:s.y, p2x:p2.x, p2y:p2.y});
  771. }
  772. }
  774. /**
  775. * @method bezierSplit (Penner)
  776. * @description Divides a cubic bezier curve into two halves (each also cubic beziers)
  777. * @param p1x (Number) pixels, endpoint 1
  778. * @param p1y (Number) pixels
  779. * @param c1x (Number) pixels, control point 1
  780. * @param c1y (Number) pixels
  781. * @param c2x (Number) pixels, control point 2
  782. * @param c2y (Number) pixels
  783. * @param p2x (Number) pixels, endpoint 2
  784. * @param p2y (Number) pixels
  785. * @returns Object (object with two cubic bezier definitions, b0 and b1)
  786. */
  787. public static function bezierSplit(p1x:Number, p1y:Number, c1x:Number, c1y:Number, c2x:Number, c2y:Number, p2x:Number, p2y:Number):Object {
  788. var m:Function = Math2.midPt;
  789. var p1:Object = {x:p1x, y:p1y};
  790. var p2:Object = {x:p2x, y:p2y};
  791. var p01:Object = m (p1x, p1y, c1x, c1y);
  792. var p12:Object = m (c1x, c1y, c2x, c2y);
  793. var p23:Object = m (c2x, c2y, p2x, p2y);
  794. var p02:Object = m (p01.x, p01.y, p12.x, p12.y);
  795. var p13:Object = m (p12.x, p12.y, p23.x, p23.y);
  796. var p03:Object = m (p02.x, p02.y, p13.x, p13.y);
  798. /*
  799. b0:{a:p0, b:p01, c:p02, d:p03},
  800. b1:{a:p03, b:p13, c:p23, d:p3 }
  801. */
  803. return { b0:{p1:p1, c1:p01, c2:p02, p2:p03}, b1:{p1:p03, c1:p13, c2:p23, p2:p2} };
  804. }
  806. /**
  807. * @method pointOnCurve (Penner)
  808. * @description Returns a point on a quadratic bezier curve with Robert Penner's optimization
  809. * of the standard equation:
  810. * {x:p1x * (1-t) * (1-t) + 2 * cx * t * (1-t) + p2x * t * t,
  811. * y:p1y * (1-t) * (1-t) + 2 * cy * t * (1-t) + p2y * t * t }
  812. * @param p1x (Number) pixels, endpoint 1
  813. * @param p1y (Number) pixels
  814. * @param cx (Number) pixels, control point
  815. * @param cy (Number) pixels
  816. * @param p2x (Number) pixels, endpoint 2
  817. * @param p2y (Number) pixels
  818. * @param t (Number) if time is 0-1 along curve, value of t to find point at
  819. * @returns Object (point at time t)
  820. */
  821. public static function pointOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, t:Number):Object {
  822. var o:Object = new Object();
  823. o.x = p1x + t*(2*(1-t)*(cx-p1x) + t*(p2x - p1x));
  824. o.y = p1y + t*(2*(1-t)*(cy-p1y) + t*(p2y - p1y));
  825. return o;
  826. }
  828. /**
  829. * @method pointsOnCurve (Penner)
  830. * @description Returns an array of objects defining points on a quadratic bezier curve, each of which
  831. * includes:
  832. * x,y = location of point defining start of segment
  833. * r = rotation of segment (last entry has none because it's just a point)
  834. * n = number of subdivisions into which curve will be divided (pts = n+1)
  835. * @param p1x (Number) pixels, endpoint 1
  836. * @param p1y (Number) pixels
  837. * @param cx (Number) pixels, control point
  838. * @param cy (Number) pixels
  839. * @param p2x (Number) pixels, endpoint 2
  840. * @param p2y (Number) pixels
  841. * @param n (Number) number of points to return
  842. * @returns Array
  843. */
  844. public static function pointsOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, n:Number):Array {
  845. var pts:Array = [];
  846. for (var i:Number=0; i <= n; i++) {
  847. pts.push(Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, i/n));
  848. if (i > 0) {
  849. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  850. }
  851. }
  852. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  853. return pts;
  854. }
  856. /**
  857. * @method pointsOnLine (Penner)
  858. * @description Returns an array of point positions and rotations for n evenly spaced points
  859. * along a line segment
  860. * x,y = location of point defining start of segment
  861. * r = rotation of segment (last entry has none because it's just a point)
  862. * n = number of subdivisions into which curve will be divided (pts = n+1)
  863. * @param p1x (Number) pixels, endpoint 1
  864. * @param p1y (Number) pixels
  865. * @param p2x (Number) pixels, endpoint 2
  866. * @param p2y (Number) pixels
  867. * @param n (Number) number of points to return
  868. * @returns Array
  869. *//* ....................................................................
  870. Returns an array of point positions and rotation for n evenly spaced points along a line segment
  871. */
  872. public static function pointsOnLine(p1x:Number, p1y:Number, p2x:Number, p2y:Number, n:Number):Array {
  873. var pts:Array = [];
  874. if (p2x != p1x) {
  875. var m:Number = (p2y-p1y)/(p2x-p1x);
  876. var b:Number = p1y - p1x * m;
  877. for (var i:Number=0; i <= n; i++) {
  878. var x:Number = p1x + ((p2x-p1x)/n) * i;
  879. pts.push({x:x, y:m*x+b});
  880. if (i > 0) {
  881. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  882. }
  883. }
  884. // vertical segment
  885. } else {
  886. for (i=0; i<=n; i++) {
  887. pts.push({x:p1x, y:p1y + ((p2y-p1y)/n) * i, r:90});
  888. }
  889. }
  890. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  891. return pts;
  892. }
  894. /**
  895. * @method curveApproxLen
  896. * @description Returns the approximate length of a curved segment, found by dividing it
  897. * into two segments at t=0.5
  898. * @param p1x (Number) pixels, endpoint 1
  899. * @param p1y (Number) pixels
  900. * @param cx (Number) pixels, control point
  901. * @param cy (Number) pixels
  902. * @param p2x (Number) pixels, endpoint 2
  903. * @param p2y (Number) pixels
  904. * @returns Number
  905. */
  906. public static function curveApproxLen(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number):Number {
  907. var mp:Object = Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, 0.5);
  908. var len1:Number = Math.sqrt((mp.x - p1x) * (mp.x - p1x) + (mp.y - p1y) * (mp.y - p1y));
  909. var len2:Number = Math.sqrt((mp.x - p2x) * (mp.x - p2x) + (mp.y - p2y) * (mp.y - p2y));
  910. return len1+len2;
  911. }
  913. /**
  914. * @method lineLen
  915. * @description Returns the length of a line segment
  916. * @param p1x (Number) pixels, endpoint 1
  917. * @param p1y (Number) pixels
  918. * @param p2x (Number) pixels, endpoint 2
  919. * @param p2y (Number) pixels
  920. * @returns Number
  921. */
  922. public static function lineLen(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Number {
  923. return Math.sqrt((p2x - p1x) * (p2x - p1x) + (p2y - p1y) * (p2y - p1y));
  924. }
  926. /**
  927. * @method roundTo
  928. * @description Returns a number rounded to specified number of decimals
  929. * @param n (Number)
  930. * @param ndec (Number) number of decimals to round to
  931. * @returns Number
  932. */
  933. public static function roundTo(n:Number, ndec:Number):Number {
  934. var multiplier:Number = Math.pow(10, ndec);
  935. return Math.round(n*multiplier)/multiplier;
  936. }
  937. }
  941. class SVGColor {
  943. public static function getByName(name:String):Number {
  944. var col:Number = SVGColor._colorTable[name];
  945. return isNaN(col) ? 0 : col;
  946. }
  948. private static const _colorTable:Object = {
  949. blue:0x0000ff,
  950. green:0x008000,
  951. red:0xff0000,
  952. aliceblue:0xf0f8ff,
  953. antiquewhite:0xfaebd7,
  954. aqua:0x00ffff,
  955. aquamarine:0x7fffd4,
  956. azure:0xf0ffff,
  957. beige:0xf5f5dc,
  958. bisque:0xffe4c4,
  959. black:0x000000,
  960. blanchedalmond:0xffebcd,
  961. blueviolet:0x8a2be2,
  962. brown:0xa52a2a,
  963. burlywood:0xdeb887,
  964. cadetblue:0x5f9ea0,
  965. chartreuse:0x7fff00,
  966. chocolate:0xd2691e,
  967. coral:0xff7f50,
  968. cornflowerblue:0x6495ed,
  969. cornsilk:0xfff8dc,
  970. crimson:0xdc143c,
  971. cyan:0x00ffff,
  972. darkblue:0x00008b,
  973. darkcyan:0x008b8b,
  974. darkgoldenrod:0xb8860b,
  975. darkgray:0xa9a9a9,
  976. darkgreen:0x006400,
  977. darkgrey:0xa9a9a9,
  978. darkkhaki:0xbdb76b,
  979. darkmagenta:0x8b008b,
  980. darkolivegreen:0x556b2f,
  981. darkorange:0xff8c00,
  982. darkorchid:0x9932cc,
  983. darkred:0x8b0000,
  984. darksalmon:0xe9967a,
  985. darkseagreen:0x8fbc8f,
  986. darkslateblue:0x483d8b,
  987. darkslategray:0x2f4f4f,
  988. darkslategrey:0x2f4f4f,
  989. darkturquoise:0x00ced1,
  990. darkviolet:0x9400d3,
  991. deeppink:0xff1493,
  992. deepskyblue:0x00bfff,
  993. dimgray:0x696969,
  994. dimgrey:0x696969,
  995. dodgerblue:0x1e90ff,
  996. firebrick:0xb22222,
  997. floralwhite:0xfffaf0,
  998. forestgreen:0x228b22,
  999. fuchsia:0xff00ff,
  1000. gainsboro:0xdcdcdc,
  1001. ghostwhite:0xf8f8ff,
  1002. gold:0xffd700,
  1003. goldenrod:0xdaa520,
  1004. gray:0x808080,
  1005. grey:0x808080,
  1006. greenyellow:0xadff2f,
  1007. honeydew:0xf0fff0,
  1008. hotpink:0xff69b4,
  1009. indianred:0xcd5c5c,
  1010. indigo:0x4b0082,
  1011. ivory:0xfffff0,
  1012. khaki:0xf0e68c,
  1013. lavender:0xe6e6fa,
  1014. lavenderblush:0xfff0f5,
  1015. lawngreen:0x7cfc00,
  1016. lemonchiffon:0xfffacd,
  1017. lightblue:0xadd8e6,
  1018. lightcoral:0xf08080,
  1019. lightcyan:0xe0ffff,
  1020. lightgoldenrodyellow:0xfafad2,
  1021. lightgray:0xd3d3d3,
  1022. lightgreen:0x90ee90,
  1023. lightgrey:0xd3d3d3,
  1024. lightpink:0xffb6c1,
  1025. lightsalmon:0xffa07a,
  1026. lightseagreen:0x20b2aa,
  1027. lightskyblue:0x87cefa,
  1028. lightslategray:0x778899,
  1029. lightslategrey:0x778899,
  1030. lightsteelblue:0xb0c4de,
  1031. lightyellow:0xffffe0,
  1032. lime:0x00ff00,
  1033. limegreen:0x32cd32,
  1034. linen:0xfaf0e6,
  1035. magenta:0xff00ff,
  1036. maroon:0x800000,
  1037. mediumaquamarine:0x66cdaa,
  1038. mediumblue:0x0000cd,
  1039. mediumorchid:0xba55d3,
  1040. mediumpurple:0x9370db,
  1041. mediumseagreen:0x3cb371,
  1042. mediumslateblue:0x7b68ee,
  1043. mediumspringgreen:0x00fa9a,
  1044. mediumturquoise:0x48d1cc,
  1045. mediumvioletred:0xc71585,
  1046. midnightblue:0x191970,
  1047. mintcream:0xf5fffa,
  1048. mistyrose:0xffe4e1,
  1049. moccasin:0xffe4b5,
  1050. navajowhite:0xffdead,
  1051. navy:0x000080,
  1052. oldlace:0xfdf5e6,
  1053. olive:0x808000,
  1054. olivedrab:0x6b8e23,
  1055. orange:0xffa500,
  1056. orangered:0xff4500,
  1057. orchid:0xda70d6,
  1058. palegoldenrod:0xeee8aa,
  1059. palegreen:0x98fb98,
  1060. paleturquoise:0xafeeee,
  1061. palevioletred:0xdb7093,
  1062. papayawhip:0xffefd5,
  1063. peachpuff:0xffdab9,
  1064. peru:0xcd853f,
  1065. pink:0xffc0cb,
  1066. plum:0xdda0dd,
  1067. powderblue:0xb0e0e6,
  1068. purple:0x800080,
  1069. rosybrown:0xbc8f8f,
  1070. royalblue:0x4169e1,
  1071. saddlebrown:0x8b4513,
  1072. salmon:0xfa8072,
  1073. sandybrown:0xf4a460,
  1074. seagreen:0x2e8b57,
  1075. seashell:0xfff5ee,
  1076. sienna:0xa0522d,
  1077. silver:0xc0c0c0,
  1078. skyblue:0x87ceeb,
  1079. slateblue:0x6a5acd,
  1080. slategray:0x708090,
  1081. slategrey:0x708090,
  1082. snow:0xfffafa,
  1083. springgreen:0x00ff7f,
  1084. steelblue:0x4682b4,
  1085. tan:0xd2b48c,
  1086. teal:0x008080,
  1087. thistle:0xd8bfd8,
  1088. tomato:0xff6347,
  1089. turquoise:0x40e0d0,
  1090. violet:0xee82ee,
  1091. wheat:0xf5deb3,
  1092. white:0xffffff,
  1093. whitesmoke:0xf5f5f5,
  1094. yellow:0xffff00,
  1095. yellowgreen:0x9acd32
  1096. }
  1098. }
  1101. class SVGPathCommandType {
  1103. public static const BEGIN_FILL_COMMAND:Number = 1;
  1104. public static const LINE_STYLE_COMMAND:Number = 2;
  1105. public static const MOVE_TO_COMMAND:Number = 3;
  1106. public static const LINE_TO_COMMAND:Number = 4;
  1107. public static const CURVE_TO_COMMAND:Number = 5;
  1109. }
  1112. interface ISVGPathCommand {
  1114. function execute(graphics:Graphics):void;
  1116. }
  1119. class SVGPathCommand implements ISVGPathCommand {
  1121. private var _type:Number;
  1122. public function get type():Number { return this._type; }
  1124. public function SVGPathCommand(type:Number = 0) {
  1125. this._type = type;
  1126. }
  1128. public function execute(graphics:Graphics):void {
  1129. throw new Error('Subclass must be implement execute method.');
  1130. }
  1132. }
  1135. class BeginFillCommand extends SVGPathCommand {
  1137. private var _color:Number;
  1138. public function get color():Number { return this._color; }
  1140. private var _alpha:Number;
  1141. public function get alpha():Number { return this._alpha; }
  1143. public function BeginFillCommand(color:Number, alpha:Number) {
  1144. super(SVGPathCommandType.BEGIN_FILL_COMMAND);
  1145. this._color = color;
  1146. this._alpha = alpha;
  1147. }
  1149. public override function execute(graphics:Graphics):void {
  1150. graphics.beginFill(this._color, this._alpha);
  1151. }
  1153. }
  1156. class CurveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1158. private var _pt1:Point;
  1159. public function get x1():Number { return this._pt1.x; }
  1160. public function get y1():Number { return this._pt1.y; }
  1162. private var _pt2:Point;
  1163. public function get x2():Number { return this._pt2.x; }
  1164. public function get y2():Number { return this._pt2.y; }
  1166. public function CurveToCommand(pt1:Point, pt2:Point) {
  1167. super(SVGPathCommandType.CURVE_TO_COMMAND);
  1168. this._pt1 = pt1;
  1169. this._pt2 = pt2;
  1170. }
  1172. public override function execute(graphics:Graphics):void {
  1173. graphics.curveTo(this._pt1.x, this._pt1.y, this._pt2.x, this._pt2.y);
  1174. }
  1176. }
  1179. class LineStyleCommand extends SVGPathCommand implements ISVGPathCommand {
  1181. private var _width:Number;
  1182. public function get width():Number { return this._width; }
  1184. private var _color:Number;
  1185. public function get color():Number { return this._color; }
  1187. private var _alpha:Number;
  1188. public function get alpha():Number { return this._alpha; }
  1190. public function LineStyleCommand(width:Number, color:Number, alpha:Number) {
  1191. super(SVGPathCommandType.LINE_STYLE_COMMAND);
  1192. this._width = width;
  1193. this._color = color;
  1194. this._alpha = alpha;
  1195. }
  1197. public override function execute(graphics:Graphics):void {
  1198. graphics.lineStyle(this._width, this._color, this._alpha);
  1199. }
  1200. }
  1203. class LineToCommand extends SVGPathCommand implements ISVGPathCommand {
  1205. private var _pt:Point;
  1206. public function get x():Number { return this._pt.x; }
  1207. public function get y():Number { return this._pt.y; }
  1209. public function LineToCommand(pt:Point) {
  1210. super(SVGPathCommandType.LINE_TO_COMMAND);
  1211. this._pt = pt;
  1212. }
  1214. public override function execute(graphics:Graphics):void {
  1215. graphics.lineTo(this._pt.x, this._pt.y);
  1216. }
  1218. }
  1221. class MoveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1223. private var _pt:Point;
  1224. public function get x():Number { return this._pt.x; }
  1225. public function get y():Number { return this._pt.y; }
  1227. public function MoveToCommand(pt:Point) {
  1228. super(SVGPathCommandType.MOVE_TO_COMMAND);
  1229. this._pt = pt;
  1230. }
  1232. public override function execute(graphics:Graphics):void {
  1233. graphics.moveTo(this._pt.x, this._pt.y);
  1234. }
  1236. }
noswf

Sewing forked from: Sewing [diff(1)]

  1. // forked from Saqoosha's Sewing
  2. package {
  4. import caurina.transitions.Equations;
  5. import caurina.transitions.Tweener;
  6. import caurina.transitions.properties.CurveModifiers;
  8. import flash.display.Graphics;
  9. import flash.display.Sprite;
  10. import flash.display.StageAlign;
  11. import flash.display.StageQuality;
  12. import flash.display.StageScaleMode;
  13. import flash.events.Event;
  14. import flash.geom.Point;
  15. import flash.net.URLLoader;
  16. import flash.net.URLLoaderDataFormat;
  17. import flash.net.URLRequest;
  18. import flash.utils.setTimeout;
  20. [SWF(width=465, height=465, backgroundColor=0xffffff, frameRate=60)]
  22. public class Sewing extends Sprite {
  24. private var _loader:URLLoader;
  25. private var _canvas:Sprite;
  26. private var _paths:Array;
  28. public function Sewing() {
  29. Wonderfl.capture_delay(8);
  31. this.stage.quality = StageQuality.BEST;
  32. this.stage.align = StageAlign.TOP_LEFT;
  33. this.stage.scaleMode = StageScaleMode.NO_SCALE;
  35. CurveModifiers.init();
  37. this._canvas = this.addChild(new Sprite()) as Sprite;
  39. this._loader = new URLLoader();
  40. this._loader.dataFormat = URLLoaderDataFormat.TEXT;
  41. this._loader.addEventListener(Event.COMPLETE, this._handleLoaded);
  42. this._loader.load(new URLRequest('http://saqoosha.net/lab/wonderfl/saqoosha.svg'));
  43. }
  45. private function _handleLoaded(e:Event):void {
  46. var svg:XML = new XML(this._loader.data);
  47. this._paths = [];
  48. var path:SVGPath;
  49. var delay:Number = 2.0;
  50. var cx:Number = parseInt(svg.@width) / 2;
  51. var cy:Number = parseInt(svg.@height) / 2;
  52. this._canvas.x = this.stage.stageWidth / 2 - cx;
  53. this._canvas.y = this.stage.stageHeight / 2 - cy;
  54. for each (var pathNode:XML in svg..*::path) {
  55. path = new SVGPath(pathNode);
  56. this._paths.push(path);
  57. var i:Number = 0;
  58. var di:Number = Math.PI * 2 / path.points.length;
  59. var px:Number = cx;
  60. var py:Number = this.stage.stageHeight - this._canvas.y;
  61. for each (var pt:Point in path.points) {
  62. Tweener.addTween(pt, {
  63. x: pt.x,
  64. y: pt.y,
  65. _bezier:[
  66. { x:cx + Math.sin(delay * 1.3) * 300 + Math.sin(delay * 10.3) * 80, y:50 },
  67. { x:100 - Math.sin(delay * 7.2) * 80, y:50 }
  68. ],
  69. time: 1.0,
  70. delay: delay,
  71. transition: Equations.easeNone
  72. });
  73. pt.x = px;
  74. pt.y = py;
  75. delay += 0.004;
  76. i += di;
  77. }
  78. }
  79. this.addEventListener(Event.ENTER_FRAME, this._drawPaths);
  80. setTimeout(function ():void {
  81. removeEventListener(Event.ENTER_FRAME, _drawPaths);
  82. }, (delay + 1) * 1000);
  83. }
  85. private function _drawPaths(e:Event):void {
  86. this._canvas.graphics.clear();
  87. for each (var path:SVGPath in this._paths) {
  88. path.draw(this._canvas.graphics);
  89. }
  90. }
  91. }
  92. }
  108. import flash.display.Graphics;
  109. import flash.geom.Point;
  110. import flash.geom.Rectangle;
  113. /**
  114. * @class PathToArray
  115. * @author Helen Triolo (with contributions from many people)
  116. * @version 1.01
  117. * @description Takes as input an SVG Path node (eg, from Illustrator 10, SVG Factory, etc, but must
  118. * not contain any CRLF characters), and an empty array.
  119. * Parses the path node to make an array of drawing commands, which include cubic bezier
  120. * draw commands. Converts the cubic beziers to an array of equivalent quad beziers,
  121. * using Robert Penner's code to convert with accuracy within 1 pixel.
  122. * Drawing commands are produced in the format originally devised by Peter Hall
  123. * in his ASVDrawing class. These are the possible elements in array dCmds (and the
  124. * corresponding Flash drawing API commands to apply them):
  125. * ['M',[x,y]] moveTo(x,y)
  126. * ['L',[x,y]] lineTo(x,y)
  127. * ['C',[cx,cy,ax,ay]] moveTo(cx,cy,ax,ay)
  128. * ['S',[width,color,alpha]] lineStyle(widtb,color,alpha)
  129. * ['F',[color,alpha]] beginFill(color,alpha)
  130. * ['EF'] endFill()
  131. * History:
  132. * v1.00 2005/11/13 Original release
  133. * v1.01 2006/05/06 Stroke corrected to stroke, line 250 (thanks Gábor Szabó)
  134. *
  135. * @param svgnode (XMLNode) Path node from SVG file
  136. * @param dCmds (Array) Empty array to write commands to
  137. */
  139. class SVGPath {
  141. private var _commands:Array;
  142. public function get commands():Array { return this._commands }
  144. private var _points:Array;
  145. public function get points():Array { return this._points }
  146. private function addPoint(... points:Array):void {
  147. for each (var pt:Point in points) {
  148. this._addPoint(pt);
  149. }
  150. }
  151. private function _addPoint(pt:Point):void {
  152. if (pt.x < this._bounds.left) {
  153. this._bounds.left = pt.x;
  154. } else if (this._bounds.right < pt.x) {
  155. this._bounds.right = pt.x;
  156. }
  157. if (pt.y < this._bounds.top) {
  158. this._bounds.top = pt.y;
  159. } else if (this._bounds.bottom < pt.y) {
  160. this._bounds.bottom = pt.y;
  161. }
  162. this._points.push(pt);
  163. }
  165. private var _bounds:Rectangle;
  166. public function get boundsRect():Rectangle { return this._bounds }
  168. private var _hasFill:Boolean;
  169. public function get hasFill():Boolean { return this._hasFill }
  171. private var _hasStroke:Boolean;
  172. public function get hasStroke():Boolean { return this._hasStroke }
  174. public function swapFillAndStroke():void {
  175. var flg:Boolean = this._hasFill;
  176. this._hasFill = this._hasStroke;
  177. this._hasStroke = flg;
  179. var val:Number = this._fillColor;
  180. this._fillColor = this._strokeColor;
  181. this._strokeColor = val;
  183. val = this._fillAlpha;
  184. this._fillAlpha = this._strokeAlpha;
  185. this._strokeAlpha = val;
  186. }
  188. private var _fillColor:Number;
  189. public function get fillColor():Number { return this._fillColor }
  190. public function set fillColor(col:Number):void { this._fillColor = col }
  192. private var _fillAlpha:Number;
  193. public function get fillAlpha():Number { return this._fillAlpha }
  194. public function set fillAlpha(al:Number):void { this._fillAlpha = al }
  196. private var _strokeColor:Number;
  197. public function get strokeColor():Number { return this._strokeColor }
  198. public function set strokeColor(col:Number):void { this._strokeColor = col }
  200. private var _strokeAlpha:Number;
  201. public function get strokeAlpha():Number { return this._strokeAlpha }
  202. public function set strokeAlpha(al:Number):void { this._strokeAlpha = al }
  204. private var _strokeWidth:Number;
  205. public function get strokeWidth():Number { return this._strokeWidth }
  206. public function set strokeWidth(wd:Number):void { this._strokeWidth = wd }
  208. /**
  209. *
  210. */
  211. public function SVGPath(svgNode:XML) {
  212. this._commands = [];
  213. this._points = [];
  214. this._bounds = new Rectangle();
  215. this._bounds.top = this._bounds.left = Number.MAX_VALUE;
  216. this._bounds.bottom = this._bounds.right = Number.MIN_VALUE;
  217. this._hasFill = false;
  218. this._hasStroke = false;
  220. this.makeDrawCmds(this.extractCmds(svgNode));
  221. }
  223. /**
  224. * @method extractCmds ()
  225. * @param node (XMLNode) SVG path node
  226. * @description Parse path node and convert to array of SVG drawing commands and data
  227. * eg, M,250.8,33.8,c,-33.6,-9.7,-42,19.1,-48.2,22.6,s,-27.9,2.2,-33.3,5.8,
  228. * c,-5.3,3.5,-17.3,23.5,-8.4,41.6
  229. * @returns (Array) array of drawing commands
  230. */
  231. private function extractCmds(node:XML):Array {
  232. var i:Number;
  233. var startColor:Number;
  234. var thisColor:Number;
  236. //var hasFill:Boolean = false;
  237. var hasTransform:Boolean = false;
  238. //var hasStroke:Boolean = false;
  239. var hasStrokeWidth:Boolean = false;
  240. var hasRotate:Number = 0;
  241. var dstring:String = "";
  242. var rotation:Number;
  244. // is there a fill attribute, a transform attribute, a stroke attribute?
  245. for each (var a:XML in node.attributes()) {
  246. switch (a.name().toString()) {
  247. case 'fill': this._hasFill = true; break;
  248. case 'transform': hasTransform = true; break;
  249. case 'stroke': this._hasStroke = true; break;
  250. case 'stroke-width': hasStrokeWidth = true; break;
  251. }
  252. }
  253. if (this._hasFill) {
  254. // parse for fill color specification
  255. // if a hex number is specified, startColor will be > 0
  256. // if a color name is specified, startColor will be 0
  257. var fillStr:String = node.@fill;
  258. if (fillStr == 'none') {
  259. this._hasFill = false;
  260. } else {
  261. startColor = fillStr.indexOf("#") + 1;
  262. if (startColor == 0) { // name specified instead of color number
  263. thisColor = SVGColor.getByName(fillStr);
  264. if (isNaN(thisColor)) {
  265. this._hasFill = false;
  266. } else {
  267. this._fillColor = thisColor;
  268. this._fillAlpha = 1.0;
  269. }
  270. } else {
  271. this._fillColor = parseInt(fillStr.substr(startColor, 6), 16);
  272. this._fillAlpha = 1.0;
  273. }
  274. }
  275. }
  277. // stroke: color, width, alpha
  278. if (this._hasStroke) {
  279. // parse for stroke color specification
  280. var strokeStr:String = node.@stroke;
  281. if (strokeStr == 'none') {
  282. this._hasStroke = false;
  283. } else {
  284. startColor = strokeStr.indexOf("#")+1;
  285. if (startColor == 0) { // name specified instead of color number
  286. thisColor = SVGColor.getByName(strokeStr);
  287. if (isNaN(thisColor)) {
  288. this._hasStroke = false;
  289. } else {
  290. this._strokeWidth = 0;
  291. this._strokeColor = SVGColor.getByName(strokeStr);
  292. this._strokeAlpha = 1.0;
  293. }
  294. } else {
  295. this._strokeWidth = 0;
  296. this._strokeColor = parseInt(strokeStr.substr(startColor,6),16);
  297. this._strokeAlpha = 1.0;
  298. }
  299. }
  300. }
  302. if (hasStrokeWidth) this._strokeWidth = Number(node.attribute("stroke-width"));
  304. // if stroke and fill are both undefined, set fill to black
  305. if (!this._hasFill && !this._hasStroke) {
  306. this._hasFill = true;
  307. this._fillColor = 0;
  308. this._fillAlpha = 1.0;
  309. }
  311. if (hasTransform) {
  312. // parse for rotation specification
  313. var transformStr:String = node.@transform;
  314. hasRotate = transformStr.indexOf("rotate");
  315. if (hasRotate > -1) {
  316. var startRotate:Number = transformStr.indexOf("(");
  317. var endRotate:Number = transformStr.indexOf(")");
  318. rotation = parseInt(transformStr.substr(startRotate+1, endRotate-startRotate));
  319. } else {
  320. rotation = 0;
  321. }
  323. } else rotation = 0;
  325. // if commas included, is it Adobe Illustrator (no spaces) or SVG Factory/other?
  326. dstring = node.@d;
  327. if (dstring.indexOf(",") > -1) { // has commas?
  328. if (dstring.indexOf(" ") > -1) { // yes, has spaces?
  329. // change spaces to commas, then deal as for Illustrator
  330. dstring = String2.replace(dstring," ",",");
  331. }
  332. } else { // no commas
  333. // get rid of extra spaces and change rest to commas
  334. dstring = String2.shrinkSequencesOf(dstring, " ");
  335. dstring = String2.replace(dstring, " ",",");
  336. }
  337. dstring = String2.replace(dstring, "c",",c,");
  338. dstring = String2.replace(dstring, "C",",C,");
  339. dstring = String2.replace(dstring, "S",",S,");
  340. dstring = String2.replace(dstring, "s",",s,");
  341. // separate the z from the last element
  342. dstring = String2.replace(dstring, "z",",z");
  343. // change the following if M can be mid-path
  344. dstring = String2.replace(dstring, "M","M,");
  345. dstring = String2.replace(dstring, "L",",L,");
  346. dstring = String2.replace(dstring, "l",",l,");
  347. dstring = String2.replace(dstring, "H",",H,");
  348. dstring = String2.replace(dstring, "h",",h,");
  349. dstring = String2.replace(dstring, "V",",V,");
  350. dstring = String2.replace(dstring, "v",",v,");
  351. dstring = String2.replace(dstring, "Q",",Q,");
  352. dstring = String2.replace(dstring, "q",",q,");
  353. dstring = String2.replace(dstring, "T",",T,");
  354. dstring = String2.replace(dstring, "t",",t,");
  355. // Adobe includes no delimiter before negative numbers
  356. dstring = String2.replace(dstring, "-",",-");
  357. // get rid of any dup commas we might have introduced
  358. dstring = String2.replace(dstring, ",,",",");
  359. // get rid of spaces
  360. // (cr/lf's have to be removed before the xml object can be created,
  361. // so that is done in xml.onData method)
  362. dstring = String2.replace(dstring, " ","");
  363. dstring = String2.replace(dstring, "\t","");
  365. return dstring.split(",");
  366. }
  368. /**
  369. * @method makeDrawCmds
  370. * @param svgCmds (Array) array of svg draw commands (as output from extractCmds)
  371. * @description Convert svg draw commands to array of ASVDrawing commands: _commands
  372. */
  373. private function makeDrawCmds(svgCmds:Array):void {
  374. var j:Number = 0, ii:int;
  375. var qc:Array;
  376. var firstP:Point;
  377. var lastP:Point;
  378. var lastC:Point;
  379. var cmd:String;
  380. var cp:Point, pp:Point;
  382. do {
  383. cmd = svgCmds[j++];
  384. switch (cmd) {
  385. case "M" :
  386. // moveTo point
  387. firstP = lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  388. if (this._hasFill) {
  389. _commands.push(new BeginFillCommand(this._fillColor, this._fillAlpha));
  390. }
  391. if (this._hasStroke) {
  392. _commands.push(new LineStyleCommand(this._strokeWidth, this._strokeColor, this._strokeAlpha));
  393. }
  394. _commands.push(new MoveToCommand(firstP));
  395. this.addPoint(firstP);
  396. j += 2;
  397. if (j < svgCmds.length && !isNaN(Number(svgCmds[j]))) {
  398. do {
  399. // if multiple points listed, add the rest as lineTo points
  400. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  401. _commands.push(new LineToCommand(lastP));
  402. this.addPoint(lastP);
  403. firstP = lastP;
  404. j += 2;
  405. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  406. }
  407. break;
  409. case "l" :
  410. do {
  411. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  412. _commands.push(new LineToCommand(lastP));
  413. this.addPoint(lastP);
  414. firstP = lastP;
  415. j += 2;
  416. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  417. break;
  419. case "L" :
  420. do {
  421. lastP = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  422. _commands.push(new LineToCommand(lastP));
  423. this.addPoint(lastP);
  424. firstP = lastP;
  425. j += 2;
  426. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  427. break;
  429. case "h" :
  430. do {
  431. lastP = new Point(lastP.x+Number(svgCmds[j]), lastP.y);
  432. _commands.push(new LineToCommand(lastP));
  433. this.addPoint(lastP);
  434. firstP = lastP;
  435. j += 1;
  436. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  437. break;
  439. case "H" :
  440. do {
  441. lastP = new Point(Number(svgCmds[j]), lastP.y);
  442. _commands.push(new LineToCommand(lastP));
  443. this.addPoint(lastP);
  444. firstP = lastP;
  445. j += 1;
  446. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  447. break;
  449. case "v" :
  450. do {
  451. lastP = new Point(lastP.x, lastP.y+Number(svgCmds[j]));
  452. _commands.push(new LineToCommand(lastP));
  453. this.addPoint(lastP);
  454. firstP = lastP;
  455. j += 1;
  456. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  457. break;
  459. case "V" :
  460. do {
  461. lastP = new Point(lastP.x, Number(svgCmds[j]));
  462. _commands.push(new LineToCommand(lastP));
  463. this.addPoint(lastP);
  464. firstP = lastP;
  465. j += 1;
  466. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  467. break;
  469. case "q" :
  470. do {
  471. // control is relative to lastP, not lastC
  472. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  473. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  474. _commands.push(new CurveToCommand(lastC, lastP));
  475. this.addPoint(lastC, lastP);
  476. firstP = lastP;
  477. j += 4;
  478. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  479. break;
  481. case "Q" :
  482. do {
  483. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  484. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  485. _commands.push(new CurveToCommand(lastC, lastP));
  486. this.addPoint(lastC, lastP);
  487. firstP = lastP;
  488. j += 4;
  489. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  490. break;
  492. case "c" :
  493. do {
  494. // don't save if c1.x=c1.y=c2.x=c2.y=0
  495. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  496. } else {
  497. qc = [];
  498. Math2.getQuadBez_RP(
  499. {x:lastP.x, y:lastP.y},
  500. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  501. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  502. {x:lastP.x+Number(svgCmds[j+4]), y:lastP.y+Number(svgCmds[j+5])},
  503. 1, qc);
  504. for (ii=0; ii
  505. cp = new Point(qc[ii].cx, qc[ii].cy);
  506. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  507. _commands.push(new CurveToCommand(cp, pp));
  508. this.addPoint(cp, pp);
  509. }
  510. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  511. lastP = new Point(lastP.x+Number(svgCmds[j+4]), lastP.y+Number(svgCmds[j+5]));
  512. this.addPoint(lastC, lastP);
  513. firstP = lastP;
  514. }
  515. j += 6;
  516. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  517. break;
  519. case "C" :
  520. do {
  521. // don't save if c1.x=c1.y=c2.x=c2.y=0
  522. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  523. } else {
  524. qc = [];
  525. Math2.getQuadBez_RP(
  526. {x:firstP.x, y:firstP.y},
  527. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  528. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  529. {x:Number(svgCmds[j+4]), y:Number(svgCmds[j+5])},
  530. 1, qc);
  531. for (ii=0; ii
  532. cp = new Point(qc[ii].cx, qc[ii].cy);
  533. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  534. _commands.push(new CurveToCommand(cp, pp));
  535. this.addPoint(cp, pp);
  536. }
  537. lastC = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  538. lastP = new Point(Number(svgCmds[j+4]), Number(svgCmds[j+5]));
  539. this.addPoint(lastC, lastP);
  540. firstP = lastP;
  541. }
  542. j += 6;
  543. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  544. break;
  546. case "s" :
  547. do {
  548. // don't save if c1.x=c1.y=c2.x=c2.y=0
  549. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  550. } else {
  551. qc = [];
  552. Math2.getQuadBez_RP(
  553. {x:firstP.x, y:firstP.y},
  554. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  555. {x:lastP.x+Number(svgCmds[j]), y:lastP.y+Number(svgCmds[j+1])},
  556. {x:lastP.x+Number(svgCmds[j+2]), y:lastP.y+Number(svgCmds[j+3])},
  557. 1, qc);
  558. for (ii=0; ii
  559. cp = new Point(qc[ii].cx, qc[ii].cy);
  560. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  561. _commands.push(new CurveToCommand(cp, pp));
  562. this.addPoint(cp, pp);
  563. }
  564. lastC = new Point(lastP.x+Number(svgCmds[j]), lastP.y+Number(svgCmds[j+1]));
  565. lastP = new Point(lastP.x+Number(svgCmds[j+2]), lastP.y+Number(svgCmds[j+3]));
  566. this.addPoint(lastC, lastP);
  567. firstP = lastP;
  568. }
  569. j += 4;
  570. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  571. break;
  573. case "S" :
  574. do {
  575. // don't save if c1.x=c1.y=c2.x=c2.y=0
  576. if (!Number(svgCmds[j]) && !Number(svgCmds[j+1]) && !Number(svgCmds[j+2]) && !Number(svgCmds[j+3])) {
  577. } else {
  578. qc = [];
  579. Math2.getQuadBez_RP(
  580. {x:firstP.x, y:firstP.y},
  581. {x:lastP.x + (lastP.x - lastC.x), y:lastP.y + (lastP.y - lastC.y)},
  582. {x:Number(svgCmds[j]), y:Number(svgCmds[j+1])},
  583. {x:Number(svgCmds[j+2]), y:Number(svgCmds[j+3])},
  584. 1, qc);
  585. for (ii=0; ii
  586. cp = new Point(qc[ii].cx, qc[ii].cy);
  587. pp = new Point(qc[ii].p2x, qc[ii].p2y);
  588. _commands.push(new CurveToCommand(cp, pp));
  589. this.addPoint(cp, pp);
  590. }
  591. lastC = new Point(Number(svgCmds[j]), Number(svgCmds[j+1]));
  592. lastP = new Point(Number(svgCmds[j+2]), Number(svgCmds[j+3]));
  593. this.addPoint(lastC, lastP);
  594. firstP = lastP;
  595. }
  596. j += 4;
  597. } while (j < svgCmds.length && !isNaN(Number(svgCmds[j])));
  598. break;
  600. case "z" :
  601. case "Z" :
  602. if (!firstP.equals(lastP)) {
  603. _commands.push(new LineToCommand(firstP));
  604. this.addPoint(firstP);
  605. }
  606. j++;
  607. break;
  609. } // end switch
  610. } while (j < svgCmds.length);
  611. }
  613. /**
  614. *
  615. */
  616. public function draw(graphics:Graphics):void {
  617. for each (var command:SVGPathCommand in this._commands) {
  618. command.execute(graphics);
  619. }
  620. }
  622. }
  626. class String2 {
  628. /**
  629. * @class String2
  630. * @author Helen Triolo, with inclusions from Tim Groleau
  631. * @description String functions not included in String needed for path->array conversion
  632. */
  634. /**
  635. * @method replace ()
  636. * @description Replaces sFind in s with sReplace
  637. * @param s (String) original string
  638. * @param sFind (String) part to be replaced
  639. * @param sReplace (String) string to replace it with
  640. * @returns (String) string with replacement
  641. */
  642. public static function replace(s:String, sFind:String, sReplace:String):String {
  643. return s.split(sFind).join(sReplace);
  644. }
  646. /**
  647. * @method shrinkSequencesOf (Groleau)
  648. * @description Shrinks all sequences of a given character in a string to one
  649. * @param s (String) original string
  650. * @param ch (String) character to be found
  651. * @returns (String) string with sequences shrunk
  652. */
  653. public static function shrinkSequencesOf(s:String, ch:String):String {
  654. var len:Number = s.length;
  655. var idx:Number = 0;
  656. var idx2:Number = 0;
  657. var rs:String = "";
  659. while ((idx2 = s.indexOf(ch, idx) + 1) != 0) {
  660. // include string up to first character in sequence
  661. rs += s.substring(idx, idx2);
  662. idx = idx2;
  664. // remove all subsequent characters in sequence
  665. while ((s.charAt(idx) == ch) && (idx < len)) idx++;
  666. }
  667. return rs + s.substring(idx, len);
  668. }
  669. }
  672. class Math2 {
  674. /**
  675. * @class Math2
  676. * @author Helen Triolo, with inclusions from Robert Penner, Tim Groleau
  677. * @description Math functions not included in Math needed for path->array conversion
  678. */
  680. /**
  681. * @method ratioTo (Groleau)
  682. * @description Returns the point on segment [p1,p2] which is ratio times the total distance
  683. * between p1 and p2 away from p1
  684. * @param p1 (Object) x and y values of point p1
  685. * @param p2 (Object) x and y values of point p2
  686. * @param ratio (Number) real
  687. * @returns Object
  688. */
  689. public static function ratioTo(p1:Object, p2:Object, ratio:Number):Object {
  690. return {x:p1.x + (p2.x - p1.x) * ratio, y:p1.y + (p2.y - p1.y) * ratio };
  691. }
  693. /**
  694. * @method intersect2Lines (Penner)
  695. * @description Returns the point of intersection between two lines
  696. * @param p1, p2 (Objects) points on line 1
  697. * @param p3, p4 (Objects) points on line 2
  698. * @returns Object (point of intersection)
  699. */
  700. public static function intersect2Lines (p1:Object, p2:Object, p3:Object, p4:Object):Object {
  701. var x1:Number = p1.x; var y1:Number = p1.y;
  702. var x4:Number = p4.x; var y4:Number = p4.y;
  703. var dx1:Number = p2.x - x1;
  704. var dx2:Number = p3.x - x4;
  706. if (!(dx1 || dx2)) return NaN;
  707. var m1:Number = (p2.y - y1) / dx1;
  708. var m2:Number = (p3.y - y4) / dx2;
  709. if (!dx1) {
  710. return { x:x1, y:m2 * (x1 - x4) + y4 };
  711. } else if (!dx2) {
  712. return { x:x4, y:m1 * (x4 - x1) + y1 };
  713. }
  714. var xInt:Number = (-m2 * x4 + y4 + m1 * x1 - y1) / (m1 - m2);
  715. var yInt:Number = m1 * (xInt - x1) + y1;
  716. return { x:xInt,y:yInt };
  717. }
  719. /**
  720. * @method rotation
  721. * @description Returns the angle in degrees from the horizontal to a point dy up and dx over
  722. * @param dy (Number) pixels
  723. * @param dx (Number) pixels
  724. * @returns Number (angle, degrees)
  725. */
  726. public static function rotation(dy:Number, dx:Number):Number {
  727. return Math.atan2(dy, dx) * 180/Math.PI;
  728. }
  730. /**
  731. * @method midPt
  732. * @description Returns the midpoint (x/y) of a line segment from p1x/p1y to p2x/p2y
  733. * @param p1x (Number) pixels
  734. * @param p1y (Number) pixels
  735. * @param p2x (Number) pixels
  736. * @param p2y (Number) pixels
  737. * @returns Object (midpoint)
  738. */
  739. public static function midPt(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Object {
  740. return {x:(p1x + p2x)/2, y:(p1y + p2y)/2};
  741. }
  743. /**
  744. * @method getQuadBez_RP (Penner)
  745. * @description Approximates a cubic bezier with as many quadratic bezier segments (n) as required
  746. * to achieve a specified tolerance
  747. * @param p1 (Object) endpoint
  748. * @param c1 (Object) 1st control point
  749. * @param c2 (Object) 2nd control point
  750. * @param p2 (Object) endpoint
  751. * @param k: tolerance (low number = most accurate result)
  752. * @param qcurves (Array) will contain array of quadratic bezier curves, each element containing
  753. * p1x, p1y, cx, cy, p2x, p2y
  754. */
  755. public static function getQuadBez_RP(p1:Object, c1:Object, c2:Object, p2:Object, k:Number, qcurves:Array):void {
  756. // find intersection between bezier arms
  757. var s:Object = Math2.intersect2Lines (p1, c1, c2, p2);
  758. // find distance between the midpoints
  759. var dx:Number = (p1.x + p2.x + s.x * 4 - (c1.x + c2.x) * 3) * .125;
  760. var dy:Number = (p1.y + p2.y + s.y * 4 - (c1.y + c2.y) * 3) * .125;
  761. // split curve if the quadratic isn't close enough
  762. if (dx*dx + dy*dy > k) {
  763. var halves:Object = Math2.bezierSplit (p1.x, p1.y, c1.x, c1.y, c2.x, c2.y, p2.x, p2.y);
  764. var b0:Object = halves.b0; var b1:Object = halves.b1;
  765. // recursive call to subdivide curve
  766. getQuadBez_RP (p1, b0.c1, b0.c2, b0.p2, k, qcurves);
  767. getQuadBez_RP (b1.p1, b1.c1, b1.c2, p2, k, qcurves);
  768. } else {
  769. // end recursion by saving points
  770. qcurves.push({p1x:p1.x, p1y:p1.y, cx:s.x, cy:s.y, p2x:p2.x, p2y:p2.y});
  771. }
  772. }
  774. /**
  775. * @method bezierSplit (Penner)
  776. * @description Divides a cubic bezier curve into two halves (each also cubic beziers)
  777. * @param p1x (Number) pixels, endpoint 1
  778. * @param p1y (Number) pixels
  779. * @param c1x (Number) pixels, control point 1
  780. * @param c1y (Number) pixels
  781. * @param c2x (Number) pixels, control point 2
  782. * @param c2y (Number) pixels
  783. * @param p2x (Number) pixels, endpoint 2
  784. * @param p2y (Number) pixels
  785. * @returns Object (object with two cubic bezier definitions, b0 and b1)
  786. */
  787. public static function bezierSplit(p1x:Number, p1y:Number, c1x:Number, c1y:Number, c2x:Number, c2y:Number, p2x:Number, p2y:Number):Object {
  788. var m:Function = Math2.midPt;
  789. var p1:Object = {x:p1x, y:p1y};
  790. var p2:Object = {x:p2x, y:p2y};
  791. var p01:Object = m (p1x, p1y, c1x, c1y);
  792. var p12:Object = m (c1x, c1y, c2x, c2y);
  793. var p23:Object = m (c2x, c2y, p2x, p2y);
  794. var p02:Object = m (p01.x, p01.y, p12.x, p12.y);
  795. var p13:Object = m (p12.x, p12.y, p23.x, p23.y);
  796. var p03:Object = m (p02.x, p02.y, p13.x, p13.y);
  798. /*
  799. b0:{a:p0, b:p01, c:p02, d:p03},
  800. b1:{a:p03, b:p13, c:p23, d:p3 }
  801. */
  803. return { b0:{p1:p1, c1:p01, c2:p02, p2:p03}, b1:{p1:p03, c1:p13, c2:p23, p2:p2} };
  804. }
  806. /**
  807. * @method pointOnCurve (Penner)
  808. * @description Returns a point on a quadratic bezier curve with Robert Penner's optimization
  809. * of the standard equation:
  810. * {x:p1x * (1-t) * (1-t) + 2 * cx * t * (1-t) + p2x * t * t,
  811. * y:p1y * (1-t) * (1-t) + 2 * cy * t * (1-t) + p2y * t * t }
  812. * @param p1x (Number) pixels, endpoint 1
  813. * @param p1y (Number) pixels
  814. * @param cx (Number) pixels, control point
  815. * @param cy (Number) pixels
  816. * @param p2x (Number) pixels, endpoint 2
  817. * @param p2y (Number) pixels
  818. * @param t (Number) if time is 0-1 along curve, value of t to find point at
  819. * @returns Object (point at time t)
  820. */
  821. public static function pointOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, t:Number):Object {
  822. var o:Object = new Object();
  823. o.x = p1x + t*(2*(1-t)*(cx-p1x) + t*(p2x - p1x));
  824. o.y = p1y + t*(2*(1-t)*(cy-p1y) + t*(p2y - p1y));
  825. return o;
  826. }
  828. /**
  829. * @method pointsOnCurve (Penner)
  830. * @description Returns an array of objects defining points on a quadratic bezier curve, each of which
  831. * includes:
  832. * x,y = location of point defining start of segment
  833. * r = rotation of segment (last entry has none because it's just a point)
  834. * n = number of subdivisions into which curve will be divided (pts = n+1)
  835. * @param p1x (Number) pixels, endpoint 1
  836. * @param p1y (Number) pixels
  837. * @param cx (Number) pixels, control point
  838. * @param cy (Number) pixels
  839. * @param p2x (Number) pixels, endpoint 2
  840. * @param p2y (Number) pixels
  841. * @param n (Number) number of points to return
  842. * @returns Array
  843. */
  844. public static function pointsOnCurve(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number, n:Number):Array {
  845. var pts:Array = [];
  846. for (var i:Number=0; i <= n; i++) {
  847. pts.push(Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, i/n));
  848. if (i > 0) {
  849. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  850. }
  851. }
  852. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  853. return pts;
  854. }
  856. /**
  857. * @method pointsOnLine (Penner)
  858. * @description Returns an array of point positions and rotations for n evenly spaced points
  859. * along a line segment
  860. * x,y = location of point defining start of segment
  861. * r = rotation of segment (last entry has none because it's just a point)
  862. * n = number of subdivisions into which curve will be divided (pts = n+1)
  863. * @param p1x (Number) pixels, endpoint 1
  864. * @param p1y (Number) pixels
  865. * @param p2x (Number) pixels, endpoint 2
  866. * @param p2y (Number) pixels
  867. * @param n (Number) number of points to return
  868. * @returns Array
  869. *//* ....................................................................
  870. Returns an array of point positions and rotation for n evenly spaced points along a line segment
  871. */
  872. public static function pointsOnLine(p1x:Number, p1y:Number, p2x:Number, p2y:Number, n:Number):Array {
  873. var pts:Array = [];
  874. if (p2x != p1x) {
  875. var m:Number = (p2y-p1y)/(p2x-p1x);
  876. var b:Number = p1y - p1x * m;
  877. for (var i:Number=0; i <= n; i++) {
  878. var x:Number = p1x + ((p2x-p1x)/n) * i;
  879. pts.push({x:x, y:m*x+b});
  880. if (i > 0) {
  881. pts[i].r = Math2.rotation(pts[i].y-pts[(i-1)].y, pts[i].x-pts[(i-1)].x);
  882. }
  883. }
  884. // vertical segment
  885. } else {
  886. for (i=0; i<=n; i++) {
  887. pts.push({x:p1x, y:p1y + ((p2y-p1y)/n) * i, r:90});
  888. }
  889. }
  890. pts.splice(0,1); // remove 1st element to return 1/n, 2/n,... n
  891. return pts;
  892. }
  894. /**
  895. * @method curveApproxLen
  896. * @description Returns the approximate length of a curved segment, found by dividing it
  897. * into two segments at t=0.5
  898. * @param p1x (Number) pixels, endpoint 1
  899. * @param p1y (Number) pixels
  900. * @param cx (Number) pixels, control point
  901. * @param cy (Number) pixels
  902. * @param p2x (Number) pixels, endpoint 2
  903. * @param p2y (Number) pixels
  904. * @returns Number
  905. */
  906. public static function curveApproxLen(p1x:Number, p1y:Number, cx:Number, cy:Number, p2x:Number, p2y:Number):Number {
  907. var mp:Object = Math2.pointOnCurve(p1x, p1y, cx, cy, p2x, p2y, 0.5);
  908. var len1:Number = Math.sqrt((mp.x - p1x) * (mp.x - p1x) + (mp.y - p1y) * (mp.y - p1y));
  909. var len2:Number = Math.sqrt((mp.x - p2x) * (mp.x - p2x) + (mp.y - p2y) * (mp.y - p2y));
  910. return len1+len2;
  911. }
  913. /**
  914. * @method lineLen
  915. * @description Returns the length of a line segment
  916. * @param p1x (Number) pixels, endpoint 1
  917. * @param p1y (Number) pixels
  918. * @param p2x (Number) pixels, endpoint 2
  919. * @param p2y (Number) pixels
  920. * @returns Number
  921. */
  922. public static function lineLen(p1x:Number, p1y:Number, p2x:Number, p2y:Number):Number {
  923. return Math.sqrt((p2x - p1x) * (p2x - p1x) + (p2y - p1y) * (p2y - p1y));
  924. }
  926. /**
  927. * @method roundTo
  928. * @description Returns a number rounded to specified number of decimals
  929. * @param n (Number)
  930. * @param ndec (Number) number of decimals to round to
  931. * @returns Number
  932. */
  933. public static function roundTo(n:Number, ndec:Number):Number {
  934. var multiplier:Number = Math.pow(10, ndec);
  935. return Math.round(n*multiplier)/multiplier;
  936. }
  937. }
  941. class SVGColor {
  943. public static function getByName(name:String):Number {
  944. var col:Number = SVGColor._colorTable[name];
  945. return isNaN(col) ? 0 : col;
  946. }
  948. private static const _colorTable:Object = {
  949. blue:0x0000ff,
  950. green:0x008000,
  951. red:0xff0000,
  952. aliceblue:0xf0f8ff,
  953. antiquewhite:0xfaebd7,
  954. aqua:0x00ffff,
  955. aquamarine:0x7fffd4,
  956. azure:0xf0ffff,
  957. beige:0xf5f5dc,
  958. bisque:0xffe4c4,
  959. black:0x000000,
  960. blanchedalmond:0xffebcd,
  961. blueviolet:0x8a2be2,
  962. brown:0xa52a2a,
  963. burlywood:0xdeb887,
  964. cadetblue:0x5f9ea0,
  965. chartreuse:0x7fff00,
  966. chocolate:0xd2691e,
  967. coral:0xff7f50,
  968. cornflowerblue:0x6495ed,
  969. cornsilk:0xfff8dc,
  970. crimson:0xdc143c,
  971. cyan:0x00ffff,
  972. darkblue:0x00008b,
  973. darkcyan:0x008b8b,
  974. darkgoldenrod:0xb8860b,
  975. darkgray:0xa9a9a9,
  976. darkgreen:0x006400,
  977. darkgrey:0xa9a9a9,
  978. darkkhaki:0xbdb76b,
  979. darkmagenta:0x8b008b,
  980. darkolivegreen:0x556b2f,
  981. darkorange:0xff8c00,
  982. darkorchid:0x9932cc,
  983. darkred:0x8b0000,
  984. darksalmon:0xe9967a,
  985. darkseagreen:0x8fbc8f,
  986. darkslateblue:0x483d8b,
  987. darkslategray:0x2f4f4f,
  988. darkslategrey:0x2f4f4f,
  989. darkturquoise:0x00ced1,
  990. darkviolet:0x9400d3,
  991. deeppink:0xff1493,
  992. deepskyblue:0x00bfff,
  993. dimgray:0x696969,
  994. dimgrey:0x696969,
  995. dodgerblue:0x1e90ff,
  996. firebrick:0xb22222,
  997. floralwhite:0xfffaf0,
  998. forestgreen:0x228b22,
  999. fuchsia:0xff00ff,
  1000. gainsboro:0xdcdcdc,
  1001. ghostwhite:0xf8f8ff,
  1002. gold:0xffd700,
  1003. goldenrod:0xdaa520,
  1004. gray:0x808080,
  1005. grey:0x808080,
  1006. greenyellow:0xadff2f,
  1007. honeydew:0xf0fff0,
  1008. hotpink:0xff69b4,
  1009. indianred:0xcd5c5c,
  1010. indigo:0x4b0082,
  1011. ivory:0xfffff0,
  1012. khaki:0xf0e68c,
  1013. lavender:0xe6e6fa,
  1014. lavenderblush:0xfff0f5,
  1015. lawngreen:0x7cfc00,
  1016. lemonchiffon:0xfffacd,
  1017. lightblue:0xadd8e6,
  1018. lightcoral:0xf08080,
  1019. lightcyan:0xe0ffff,
  1020. lightgoldenrodyellow:0xfafad2,
  1021. lightgray:0xd3d3d3,
  1022. lightgreen:0x90ee90,
  1023. lightgrey:0xd3d3d3,
  1024. lightpink:0xffb6c1,
  1025. lightsalmon:0xffa07a,
  1026. lightseagreen:0x20b2aa,
  1027. lightskyblue:0x87cefa,
  1028. lightslategray:0x778899,
  1029. lightslategrey:0x778899,
  1030. lightsteelblue:0xb0c4de,
  1031. lightyellow:0xffffe0,
  1032. lime:0x00ff00,
  1033. limegreen:0x32cd32,
  1034. linen:0xfaf0e6,
  1035. magenta:0xff00ff,
  1036. maroon:0x800000,
  1037. mediumaquamarine:0x66cdaa,
  1038. mediumblue:0x0000cd,
  1039. mediumorchid:0xba55d3,
  1040. mediumpurple:0x9370db,
  1041. mediumseagreen:0x3cb371,
  1042. mediumslateblue:0x7b68ee,
  1043. mediumspringgreen:0x00fa9a,
  1044. mediumturquoise:0x48d1cc,
  1045. mediumvioletred:0xc71585,
  1046. midnightblue:0x191970,
  1047. mintcream:0xf5fffa,
  1048. mistyrose:0xffe4e1,
  1049. moccasin:0xffe4b5,
  1050. navajowhite:0xffdead,
  1051. navy:0x000080,
  1052. oldlace:0xfdf5e6,
  1053. olive:0x808000,
  1054. olivedrab:0x6b8e23,
  1055. orange:0xffa500,
  1056. orangered:0xff4500,
  1057. orchid:0xda70d6,
  1058. palegoldenrod:0xeee8aa,
  1059. palegreen:0x98fb98,
  1060. paleturquoise:0xafeeee,
  1061. palevioletred:0xdb7093,
  1062. papayawhip:0xffefd5,
  1063. peachpuff:0xffdab9,
  1064. peru:0xcd853f,
  1065. pink:0xffc0cb,
  1066. plum:0xdda0dd,
  1067. powderblue:0xb0e0e6,
  1068. purple:0x800080,
  1069. rosybrown:0xbc8f8f,
  1070. royalblue:0x4169e1,
  1071. saddlebrown:0x8b4513,
  1072. salmon:0xfa8072,
  1073. sandybrown:0xf4a460,
  1074. seagreen:0x2e8b57,
  1075. seashell:0xfff5ee,
  1076. sienna:0xa0522d,
  1077. silver:0xc0c0c0,
  1078. skyblue:0x87ceeb,
  1079. slateblue:0x6a5acd,
  1080. slategray:0x708090,
  1081. slategrey:0x708090,
  1082. snow:0xfffafa,
  1083. springgreen:0x00ff7f,
  1084. steelblue:0x4682b4,
  1085. tan:0xd2b48c,
  1086. teal:0x008080,
  1087. thistle:0xd8bfd8,
  1088. tomato:0xff6347,
  1089. turquoise:0x40e0d0,
  1090. violet:0xee82ee,
  1091. wheat:0xf5deb3,
  1092. white:0xffffff,
  1093. whitesmoke:0xf5f5f5,
  1094. yellow:0xffff00,
  1095. yellowgreen:0x9acd32
  1096. }
  1098. }
  1101. class SVGPathCommandType {
  1103. public static const BEGIN_FILL_COMMAND:Number = 1;
  1104. public static const LINE_STYLE_COMMAND:Number = 2;
  1105. public static const MOVE_TO_COMMAND:Number = 3;
  1106. public static const LINE_TO_COMMAND:Number = 4;
  1107. public static const CURVE_TO_COMMAND:Number = 5;
  1109. }
  1112. interface ISVGPathCommand {
  1114. function execute(graphics:Graphics):void;
  1116. }
  1119. class SVGPathCommand implements ISVGPathCommand {
  1121. private var _type:Number;
  1122. public function get type():Number { return this._type; }
  1124. public function SVGPathCommand(type:Number = 0) {
  1125. this._type = type;
  1126. }
  1128. public function execute(graphics:Graphics):void {
  1129. throw new Error('Subclass must be implement execute method.');
  1130. }
  1132. }
  1135. class BeginFillCommand extends SVGPathCommand {
  1137. private var _color:Number;
  1138. public function get color():Number { return this._color; }
  1140. private var _alpha:Number;
  1141. public function get alpha():Number { return this._alpha; }
  1143. public function BeginFillCommand(color:Number, alpha:Number) {
  1144. super(SVGPathCommandType.BEGIN_FILL_COMMAND);
  1145. this._color = color;
  1146. this._alpha = alpha;
  1147. }
  1149. public override function execute(graphics:Graphics):void {
  1150. graphics.beginFill(this._color, this._alpha);
  1151. }
  1153. }
  1156. class CurveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1158. private var _pt1:Point;
  1159. public function get x1():Number { return this._pt1.x; }
  1160. public function get y1():Number { return this._pt1.y; }
  1162. private var _pt2:Point;
  1163. public function get x2():Number { return this._pt2.x; }
  1164. public function get y2():Number { return this._pt2.y; }
  1166. public function CurveToCommand(pt1:Point, pt2:Point) {
  1167. super(SVGPathCommandType.CURVE_TO_COMMAND);
  1168. this._pt1 = pt1;
  1169. this._pt2 = pt2;
  1170. }
  1172. public override function execute(graphics:Graphics):void {
  1173. graphics.curveTo(this._pt1.x, this._pt1.y, this._pt2.x, this._pt2.y);
  1174. }
  1176. }
  1179. class LineStyleCommand extends SVGPathCommand implements ISVGPathCommand {
  1181. private var _width:Number;
  1182. public function get width():Number { return this._width; }
  1184. private var _color:Number;
  1185. public function get color():Number { return this._color; }
  1187. private var _alpha:Number;
  1188. public function get alpha():Number { return this._alpha; }
  1190. public function LineStyleCommand(width:Number, color:Number, alpha:Number) {
  1191. super(SVGPathCommandType.LINE_STYLE_COMMAND);
  1192. this._width = width;
  1193. this._color = color;
  1194. this._alpha = alpha;
  1195. }
  1197. public override function execute(graphics:Graphics):void {
  1198. graphics.lineStyle(this._width, this._color, this._alpha);
  1199. }
  1200. }
  1203. class LineToCommand extends SVGPathCommand implements ISVGPathCommand {
  1205. private var _pt:Point;
  1206. public function get x():Number { return this._pt.x; }
  1207. public function get y():Number { return this._pt.y; }
  1209. public function LineToCommand(pt:Point) {
  1210. super(SVGPathCommandType.LINE_TO_COMMAND);
  1211. this._pt = pt;
  1212. }
  1214. public override function execute(graphics:Graphics):void {
  1215. graphics.lineTo(this._pt.x, this._pt.y);
  1216. }
  1218. }
  1221. class MoveToCommand extends SVGPathCommand implements ISVGPathCommand {
  1223. private var _pt:Point;
  1224. public function get x():Number { return this._pt.x; }
  1225. public function get y():Number { return this._pt.y; }
  1227. public function MoveToCommand(pt:Point) {
  1228. super(SVGPathCommandType.MOVE_TO_COMMAND);
  1229. this._pt = pt;
  1230. }
  1232. public override function execute(graphics:Graphics):void {
  1233. graphics.moveTo(this._pt.x, this._pt.y);
  1234. }
  1236. }
noswf
Get Adobe Flash Player