Skip to content

Instantly share code, notes, and snippets.

@giorrrgio
Forked from benbarnett/raphael-svg-buildjson
Created August 27, 2012 09:49
Show Gist options
  • Save giorrrgio/3487024 to your computer and use it in GitHub Desktop.
Save giorrrgio/3487024 to your computer and use it in GitHub Desktop.
loop through the 'paper' variable from Raphael JS and build up the JSON object describing all images and paths within it.
// loop through the 'paper' variable from Raphael JS and build up the JSON object describing all images and paths within it.
buildJSON = function(paper) {
var svgdata = [];
svgdata.push({
width: 390,
height: 400
});
$.each(paper,
function(i, o) {
var node = o;
if (node.type == "image") {
var object = {
type: node.type,
width: node.attrs['width'],
height: node.attrs['height'],
x: node.attrs['x'],
y: node.attrs['y'],
src: node.attrs['src'],
transform: node.transformations ? node.transformations.join(' ') : ''
}
}
if (node.type == "path") {
var path = "";
$.each(node.attrs['path'],
function(i, group) {
$.each(group,
function(index, value) {
if (index < 1) {
path += value;
}
else {
if (index == (group.length - 1)) {
path += value;
}
else {
path += value + ',';
}
}
});
});
var object = {
type: node.type,
fill: node.attrs['fill'],
opacity: node.attrs['opacity'],
translation: node.attrs['translation'],
scale: node.attrs['scale'],
path: path,
stroke: node.attrs['stroke'] === 0 ? 'none': node.attrs['stroke'],
transform: node.transformations ? node.transformations.join(' ') : ''
}
}
svgdata.push(object);
});
$('#output').val(JSON.stringify(svgdata));
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment