Rendering Issue (Offset incorrectly)
MrDuncanM opened this issue · 1 comments
I think I am having issues with the viewbox attribute. When adding the file to the projects demo it renders at the bottom of the SVGImageView. When rendering it using the SVGLayer directly I get the same result.
The SVG in question has the attribute viewBox="271 652 587 400". I don't see this taken into account in the code.
Reproduction Steps:
- Load the SVG: https://s3.amazonaws.com/music-provider-logos/AmazonMusic.svg
- Set contentsGravity = kCAGravityResizeAspect.
- Render the SVGLayer or display the SVGImageView.
- The SVG is offset to the bottom of the context / view.
The basic gist of what I am trying follows:
SVGLayer *testLayer = [[SVGLayer alloc] initWithContentsOfURL:@"https://s3.amazonaws.com/music-provider-logos/AmazonMusic.svg"];
testLayer.contentsGravity = kCAGravityResizeAspect;
testLayer.frame = CGRectMake(0, 0, 300, 300);
UIGraphicsImageRendererFormat *format = [UIGraphicsImageRendererFormat defaultFormat];
format.scale = 1;
UIGraphicsImageRenderer *renderer = [[UIGraphicsImageRenderer alloc] initWithSize:CGSizeMake(300, 300) format:format];
UIImage *scaledImage = [renderer imageWithActions:^(UIGraphicsImageRendererContext * _Nonnull rendererContext) {
// the SVG is white so a dark background is helpful.
CGContextSetRGBFillColor(rendererContext.CGContext, 0, 0, 0, 1);
[rendererContext fillRect:CGRectMake(0, 0, 300, 300)];
[testLayer renderInContext:rendererContext.CGContext];
};
At this point I grab a PNGRepresentation of the scaledImage but I don't think that is relevant since adding the SVG reference above to the demo also renders at the bottom of the screen not centered.
Notes:
- If I check testLayer.preferredFrameSize it returns roughly CGSize(839, 1026)
- Opening the SVG in GIMP defaults to the "correct" resolution of 587x400 as defined in the viewbox attribute.
- The image I get out looks like this:
Specifications
- PocketSVG Version: Master
- Xcode Version: 10.2.1
- iOS Version: 12.2
viewbox
is not taken into account. PocketSVG simply reads the paths as CGPath
s or SVGBezierPath
s. You'll have to process the svg to get rid of the offset.