mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2025-06-08 19:24:15 -04:00
Fix support for viewBox when importing SVG symbols.
This commit is contained in:
parent
12d4d563d9
commit
01026c0896
4 changed files with 12 additions and 9 deletions
|
@ -12,7 +12,7 @@
|
|||
<body>
|
||||
<svg version="1.1" id="svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
width="595" height="841" xml:space="preserve">
|
||||
<symbol id="circle" viewBox="-24 -24 48 48">
|
||||
<symbol id="circle" viewBox="0 0 48 48" overflow="visible">
|
||||
<path fill="#FF0049" d="M24,0c0-13.255-10.745-24-24-24S-24-13.255-24,0s10.745,24,24,24S24,13.255,24,0z"/>
|
||||
</symbol>
|
||||
<use xlink:href="#circle" width="48" height="48" x="-24" y="-24" transform="matrix(1.1667 1.1667 1.1667 -1.1667 177.0005 96)" overflow="visible"/>
|
||||
|
|
|
@ -24,6 +24,7 @@ var PlacedSymbol = this.PlacedSymbol = PlacedItem.extend(/** @lends PlacedSymbol
|
|||
_serializeFields: {
|
||||
symbol: null
|
||||
},
|
||||
|
||||
/**
|
||||
* Creates a new PlacedSymbol Item.
|
||||
*
|
||||
|
|
|
@ -276,7 +276,7 @@ var Raster = this.Raster = PlacedItem.extend(/** @lends Raster# */{
|
|||
// See if the linked image is base64 encoded already, if so reuse it,
|
||||
// otherwise try using canvas.toDataUrl()
|
||||
var src = this._image && this._image.src;
|
||||
if (/^data:/.test(src))
|
||||
if (/^data:/.test(src))
|
||||
return src;
|
||||
var canvas = this.getCanvas();
|
||||
return canvas ? canvas.toDataURL() : null;
|
||||
|
|
|
@ -379,20 +379,23 @@ new function() {
|
|||
viewBox: function(item, value, name, node) {
|
||||
// http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute
|
||||
// TODO: implement preserveAspectRatio attribute
|
||||
if (item instanceof Symbol)
|
||||
return;
|
||||
var values = convertValue(value, 'array'),
|
||||
rectangle = Rectangle.create.apply(this, values),
|
||||
size = getSize(node, 'width', 'height', true),
|
||||
scale = size ? rectangle.getSize().divide(size) : 1,
|
||||
offset = rectangle.getPoint(),
|
||||
matrix = new Matrix().translate(offset).scale(scale);
|
||||
item.transform(matrix.inverted());
|
||||
if (size)
|
||||
rectangle.setSize(size);
|
||||
rectangle.setPoint(0);
|
||||
// TODO: the viewbox does not always need to be clipped
|
||||
return createClipGroup(item, new Path.Rectangle(rectangle));
|
||||
if (item instanceof Symbol) {
|
||||
matrix.translate(rectangle.getSize().divide(-2));
|
||||
item._definition.transform(matrix);
|
||||
} else {
|
||||
item.transform(matrix.inverted());
|
||||
rectangle.setPoint(0);
|
||||
// TODO: the viewBox does not always need to be clipped
|
||||
return createClipGroup(item, new Path.Rectangle(rectangle));
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -467,7 +470,6 @@ new function() {
|
|||
return item;
|
||||
}
|
||||
|
||||
|
||||
Item.inject(/** @lends Item# */{
|
||||
/**
|
||||
* Converts the passed node node into a Paper.js item and adds it to the
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue