made with requirebin
Created
April 20, 2016 07:46
-
-
Save daemth/1d93e36c60d6147822d0baee78bede6a to your computer and use it in GitHub Desktop.
requirebin sketch
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Welcome! require() some modules from npm (like you were using browserify) | |
// and then hit Run Code to run your code on the right side. | |
// Modules get downloaded from browserify-cdn and bundled in your browser. | |
// https://tonicdev.com/npm/svg-points | |
var p = require("svg-points") | |
var toPoints = p.toPoints; | |
const points = toPoints( { | |
shape: 'path', | |
d: 'M-49.1,194.8c0.6-0.9,1.2-1.9,1.8-2.8c4.8-8.4,6-18.2,3.4-27.6c-1.7-6.1-4.9-11.6-9.3-16c-3.4-3.4-7.4-6-11.7-7.8l5,9.1l-8.2,4.5c1.9,1,3.6,2.3,5.2,3.9c2.8,2.8,4.8,6.2,5.8,10c1.6,5.7,0.9,11.7-2,16.9l-4.4-4.4l0.2,18.5l18.3-0.2L-49.1,194.8z', | |
} ); | |
console.log(points); | |
console.log(points.length); | |
var output = []; | |
for (var i = 0, len = points.length; i < len; i++){ | |
if(points[i].moveTo === true){ | |
output.push('M'); | |
} | |
if(points[i].curve){ | |
output.push('c'); | |
} | |
output.push(points[i].x); | |
output.push(points[i].y); | |
} | |
console.log(output); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
setTimeout(function(){require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _toPoints=require("./toPoints");var _toPoints2=_interopRequireDefault(_toPoints);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}var pointsToD=function pointsToD(p){var d="";var i=0;var firstPoint=p[i];var _iteratorNormalCompletion=true;var _didIteratorError=false;var _iteratorError=undefined;try{for(var _iterator=p[Symbol.iterator](),_step;!(_iteratorNormalCompletion=(_step=_iterator.next()).done);_iteratorNormalCompletion=true){var point=_step.value;var isFirstPoint=i===0;var isLastPoint=i===p.length-1;var prevPoint=isFirstPoint?null:p[i-1];var _point$curve=point.curve;var curve=_point$curve===undefined?false:_point$curve;var moveTo=point.moveTo;var x=point.x;var y=point.y;if(moveTo||isFirstPoint){if(!isLastPoint){d+="M"+x+","+y}}else if(curve){switch(curve.type){case"arc":var _point$curve2=point.curve;var _point$curve2$largeAr=_point$curve2.largeArcFlag;var largeArcFlag=_point$curve2$largeAr===undefined?0:_point$curve2$largeAr;var rx=_point$curve2.rx;var ry=_point$curve2.ry;var _point$curve2$sweepFl=_point$curve2.sweepFlag;var sweepFlag=_point$curve2$sweepFl===undefined?0:_point$curve2$sweepFl;var _point$curve2$xAxisRo=_point$curve2.xAxisRotation;var xAxisRotation=_point$curve2$xAxisRo===undefined?0:_point$curve2$xAxisRo;d+="A"+rx+","+ry+","+xAxisRotation+","+largeArcFlag+","+sweepFlag+","+x+","+y;break;case"cubic":var _point$curve3=point.curve;var cx1=_point$curve3.x1;var cy1=_point$curve3.y1;var cx2=_point$curve3.x2;var cy2=_point$curve3.y2;d+="C"+cx1+","+cy1+","+cx2+","+cy2+","+x+","+y;break;case"quadratic":var _point$curve4=point.curve;var qx1=_point$curve4.x1;var qy1=_point$curve4.y1;d+="Q"+qx1+","+qy1+","+x+","+y;break}if(isLastPoint&&x===firstPoint.x&&y===firstPoint.y){d+="Z"}}else if(isLastPoint&&x===firstPoint.x&&y===firstPoint.y){d+="Z"}else if(x!==prevPoint.x&&y!==prevPoint.y){d+="L"+x+","+y}else if(x!==prevPoint.x){d+="H"+x}else if(y!==prevPoint.y){d+="V"+y}i++}}catch(err){_didIteratorError=true;_iteratorError=err}finally{try{if(!_iteratorNormalCompletion&&_iterator.return){_iterator.return()}}finally{if(_didIteratorError){throw _iteratorError}}}return d};var toPath=function toPath(s){var isPoints=Array.isArray(s);var isGroup=isPoints?Array.isArray(s[0]):s.shape==="g";var points=isPoints?s:isGroup?s.shapes.map(function(shp){return(0,_toPoints2.default)(shp)}):(0,_toPoints2.default)(s);if(isGroup){return points.map(function(p){return pointsToD(p)})}return pointsToD(points)};exports.default=toPath},{"./toPoints":2}],2:[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:true});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};function _objectWithoutProperties(obj,keys){var target={};for(var i in obj){if(keys.indexOf(i)>=0)continue;if(!Object.prototype.hasOwnProperty.call(obj,i))continue;target[i]=obj[i]}return target}var toPoints=function toPoints(_ref){var shape=_ref.shape;var attributes=_objectWithoutProperties(_ref,["shape"]);switch(shape){case"circle":return getPointsFromCircle(attributes);case"ellipse":return getPointsFromEllipse(attributes);case"line":return getPointsFromLine(attributes);case"path":return getPointsFromPath(attributes);case"polygon":return getPointsFromPolygon(attributes);case"polyline":return getPointsFromPolyline(attributes);case"rect":return getPointsFromRect(attributes);case"g":return getPointsFromG(attributes);default:throw new Error("Not a valid shape type")}};var getPointsFromCircle=function getPointsFromCircle(_ref2){var cx=_ref2.cx;var cy=_ref2.cy;var r=_ref2.r;return[{x:cx,y:cy-r,moveTo:true},{x:cx,y:cy+r,curve:{type:"arc",rx:r,ry:r}},{x:cx,y:cy-r,curve:{type:"arc",rx:r,ry:r}}]};var getPointsFromEllipse=function getPointsFromEllipse(_ref3){var cx=_ref3.cx;var cy=_ref3.cy;var rx=_ref3.rx;var ry=_ref3.ry;return[{x:cx,y:cy-ry,moveTo:true},{x:cx,y:cy+ry,curve:{type:"arc",rx:rx,ry:ry}},{x:cx,y:cy-ry,curve:{type:"arc",rx:rx,ry:ry}}]};var getPointsFromLine=function getPointsFromLine(_ref4){var x1=_ref4.x1;var x2=_ref4.x2;var y1=_ref4.y1;var y2=_ref4.y2;return[{x:x1,y:y1,moveTo:true},{x:x2,y:y2}]};var validCommands=/[MmLlHhVvCcSsQqTtAaZz]/g;var commandLengths={m:2,l:2,h:1,v:1,c:6,s:4,q:4,t:2,a:7,z:0};var optionalArcKeys=["xAxisRotation","largeArcFlag","sweepFlag"];var getCommands=function getCommands(d){return d.match(validCommands)};var getParams=function getParams(d){return d.split(validCommands).map(function(v){return v.replace(/[0-9]+-/g,function(m){return m.slice(0,-1)+" -"})}).map(function(v){return v.replace(/\.[0-9]+/g,function(m){return m+" "})}).map(function(v){return v.trim()}).filter(function(v){return v.length>0}).map(function(v){return v.split(/[ ,]+/).map(parseFloat).filter(function(n){return!isNaN(n)})})};var getPointsFromPath=function getPointsFromPath(_ref5){var d=_ref5.d;var commands=getCommands(d);var params=getParams(d);var points=[];var moveTo=void 0;for(var i=0,l=commands.length;i<l;i++){var command=commands[i];var commandLength=commandLengths[command.toLowerCase()];var relative=false;if(commandLength>0){var commandParams=params.shift();var iterations=commandParams.length/commandLength;for(var j=0;j<iterations;j++){var prevPoint=i===0?null:points[points.length-1];switch(command){case"m":relative=true;case"M":var x=(relative?prevPoint.x:0)+commandParams.shift();var y=(relative?prevPoint.y:0)+commandParams.shift();moveTo={x:x,y:y};points.push({x:x,y:y,moveTo:true});break;case"l":relative=true;case"L":points.push({x:(relative?prevPoint.x:0)+commandParams.shift(),y:(relative?prevPoint.y:0)+commandParams.shift()});break;case"h":relative=true;case"H":points.push({x:(relative?prevPoint.x:0)+commandParams.shift(),y:prevPoint.y});break;case"v":relative=true;case"V":points.push({x:prevPoint.x,y:(relative?prevPoint.y:0)+commandParams.shift()});break;case"a":relative=true;case"A":points.push({curve:{type:"arc",rx:commandParams.shift(),ry:commandParams.shift(),xAxisRotation:commandParams.shift(),largeArcFlag:commandParams.shift(),sweepFlag:commandParams.shift()},x:(relative?prevPoint.x:0)+commandParams.shift(),y:(relative?prevPoint.y:0)+commandParams.shift()});var _iteratorNormalCompletion=true;var _didIteratorError=false;var _iteratorError=undefined;try{for(var _iterator=optionalArcKeys[Symbol.iterator](),_step;!(_iteratorNormalCompletion=(_step=_iterator.next()).done);_iteratorNormalCompletion=true){var k=_step.value;if(points[i]["curve"][k]===0){delete points[i]["curve"][k]}}}catch(err){_didIteratorError=true;_iteratorError=err}finally{try{if(!_iteratorNormalCompletion&&_iterator.return){_iterator.return()}}finally{if(_didIteratorError){throw _iteratorError}}}break;case"c":relative=true;case"C":points.push({curve:{type:"cubic",x1:(relative?prevPoint.x:0)+commandParams.shift(),y1:(relative?prevPoint.y:0)+commandParams.shift(),x2:(relative?prevPoint.x:0)+commandParams.shift(),y2:(relative?prevPoint.y:0)+commandParams.shift()},x:(relative?prevPoint.x:0)+commandParams.shift(),y:(relative?prevPoint.y:0)+commandParams.shift()});break;case"s":relative=true;case"S":var sx2=(relative?prevPoint.x:0)+commandParams.shift();var sy2=(relative?prevPoint.y:0)+commandParams.shift();var sx=(relative?prevPoint.x:0)+commandParams.shift();var sy=(relative?prevPoint.y:0)+commandParams.shift();var diff={};var sx1=void 0;var sy1=void 0;if(prevPoint.curve&&prevPoint.curve.type==="cubic"){diff.x=Math.abs(prevPoint.x-prevPoint.curve.x2);diff.y=Math.abs(prevPoint.y-prevPoint.curve.y2);sx1=prevPoint.x<prevPoint.curve.x2?prevPoint.x-diff.x:prevPoint.x+diff.x;sy1=prevPoint.y<prevPoint.curve.y2?prevPoint.y-diff.y:prevPoint.y+diff.y}else{diff.x=Math.abs(sx-sx2);diff.y=Math.abs(sy-sy2);sx1=sx<sx2?prevPoint.x-diff.x:prevPoint.x+diff.x;sy1=sy<sy2?prevPoint.y+diff.y:prevPoint.y-diff.y}points.push({curve:{type:"cubic",x1:sx1,y1:sy1,x2:sx2,y2:sy2},x:sx,y:sy});break;case"q":relative=true;case"Q":points.push({curve:{type:"quadratic",x1:(relative?prevPoint.x:0)+commandParams.shift(),y1:(relative?prevPoint.y:0)+commandParams.shift()},x:(relative?prevPoint.x:0)+commandParams.shift(),y:(relative?prevPoint.y:0)+commandParams.shift()});break;case"t":relative=true;case"T":var tx=(relative?prevPoint.x:0)+commandParams.shift();var ty=(relative?prevPoint.y:0)+commandParams.shift();var tx1=void 0;var ty1=void 0;if(prevPoint.curve&&prevPoint.curve.type==="quadratic"){var _diff={x:Math.abs(prevPoint.x-prevPoint.curve.x1),y:Math.abs(prevPoint.y-prevPoint.curve.y1)};tx1=prevPoint.x<prevPoint.curve.x1?prevPoint.x-_diff.x:prevPoint.x+_diff.x;ty1=prevPoint.y<prevPoint.curve.y1?prevPoint.y-_diff.y:prevPoint.y+_diff.y}else{tx1=prevPoint.x;ty1=prevPoint.y}points.push({curve:{type:"quadratic",x1:tx1,y1:ty1},x:tx,y:ty});break}}}else{points.push({x:moveTo.x,y:moveTo.y})}}return points};var getPointsFromPolygon=function getPointsFromPolygon(_ref6){var points=_ref6.points;return getPointsFromPoints({closed:true,points:points})};var getPointsFromPolyline=function getPointsFromPolyline(_ref7){var points=_ref7.points;return getPointsFromPoints({closed:false,points:points})};var getPointsFromPoints=function getPointsFromPoints(_ref8){var closed=_ref8.closed;var points=_ref8.points;var numbers=points.split(/[\s,]+/).map(function(n){return parseFloat(n)});var p=numbers.reduce(function(arr,point,i){if(i%2===0){arr.push({x:point})}else{arr[(i-1)/2].y=point}return arr},[]);if(closed){p.push(_extends({},p[0]))}p[0].moveTo=true;return p};var getPointsFromRect=function getPointsFromRect(_ref9){var height=_ref9.height;var rx=_ref9.rx;var ry=_ref9.ry;var width=_ref9.width;var x=_ref9.x;var y=_ref9.y;if(rx||ry){return getPointsFromRectWithCornerRadius({height:height,rx:rx?rx:ry,ry:ry?ry:rx,width:width,x:x,y:y})}return getPointsFromBasicRect({height:height,width:width,x:x,y:y})};var getPointsFromBasicRect=function getPointsFromBasicRect(_ref10){var height=_ref10.height;var width=_ref10.width;var x=_ref10.x;var y=_ref10.y;return[{x:x,y:y,moveTo:true},{x:x+width,y:y},{x:x+width,y:y+height},{x:x,y:y+height},{x:x,y:y}]};var getPointsFromRectWithCornerRadius=function getPointsFromRectWithCornerRadius(_ref11){var height=_ref11.height;var rx=_ref11.rx;var ry=_ref11.ry;var width=_ref11.width;var x=_ref11.x;var y=_ref11.y;var curve={type:"arc",rx:rx,ry:ry,sweepFlag:1};return[{x:x+rx,y:y,moveTo:true},{x:x+width-rx,y:y},{x:x+width,y:y+ry,curve:curve},{x:x+width,y:y+height-ry},{x:x+width-rx,y:y+height,curve:curve},{x:x+rx,y:y+height},{x:x,y:y+height-ry,curve:curve},{x:x,y:y+ry},{x:x+rx,y:y,curve:curve}]};var getPointsFromG=function getPointsFromG(_ref12){var shapes=_ref12.shapes;return shapes.map(function(s){return toPoints(s)})};exports.default=toPoints},{}],"svg-points":[function(require,module,exports){"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.toPoints=exports.toPath=undefined;var _toPath=require("./toPath");var _toPath2=_interopRequireDefault(_toPath);var _toPoints=require("./toPoints");var _toPoints2=_interopRequireDefault(_toPoints);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{"default":obj}}exports.toPath=_toPath2.default;exports.toPoints=_toPoints2.default},{"./toPath":1,"./toPoints":2}]},{},[]);var p=require("svg-points");var toPoints=p.toPoints;const points=toPoints({shape:"path",d:"M-49.1,194.8c0.6-0.9,1.2-1.9,1.8-2.8c4.8-8.4,6-18.2,3.4-27.6c-1.7-6.1-4.9-11.6-9.3-16c-3.4-3.4-7.4-6-11.7-7.8l5,9.1l-8.2,4.5c1.9,1,3.6,2.3,5.2,3.9c2.8,2.8,4.8,6.2,5.8,10c1.6,5.7,0.9,11.7-2,16.9l-4.4-4.4l0.2,18.5l18.3-0.2L-49.1,194.8z"});console.log(points);console.log(points.length);var output=[];for(var i=0,len=points.length;i<len;i++){if(points[i].moveTo===true){output.push("M")}if(points[i].curve){output.push("c")}output.push(points[i].x);output.push(points[i].y)}console.log(output)},0); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "requirebin-sketch", | |
"version": "1.0.0", | |
"dependencies": { | |
"svg-points": "1.2.4" | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- contents of this file will be placed inside the <body> --> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- contents of this file will be placed inside the <head> --> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment