I am having problem with SVG to JPG using Aspose.Html if the SVG contains a transform attribute particularly the rotate
Here is the original file what it looks like
image.png (7.3 KB)
The XML of the original file rotated 180 degrees
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 27.8.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" transform="scale(1,1) rotate(180)"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 60 60"
style="enable-background:new 0 0 60 60;" xml:space="preserve">
<style type="text/css">
.st0{fill:#4C4E4F;}
</style>
<path class="st0" d="M15.9,32.7l0.1-6.8v-0.6c0,0,0,0,0-0.1l0.6-0.6l0,0l0.9-0.7c0,0,0,0,0.1,0h0.9v0h0.2v0h0.1v-1.4
c0-0.1,0-0.1,0-0.2v-2c0-0.7,0.5-1.2,1.2-1.2h3.5c0.6,0,1.2,0.6,1.2,1.2V21h11.2v-0.7c0-0.7,0.5-1.3,1.2-1.3h3.5
c0.6,0,1.2,0.6,1.2,1.3v0.9c0,0,0,0,0,0v2.5c0,0,0,0,0,0.1v0.1h0.1v0h0.2v0h0.9c0,0,0,0,0.1,0l0.9,0.7c0,0,0,0,0,0l0.6,0.7
c0,0,0,0,0,0.1V26l0,6.7v2.5c0,0,0,0.1-0.1,0.1h-2.6v9c0,0,0,0,0,0c-0.1,0.1-0.2,0.2-0.2,0.2c0,0,0,0-0.1,0V52h0.3v2.2h-23V52H19
v-9.9h-0.1c0,0-0.1,0-0.1-0.1v-0.9l0-3.2h-2.2l-0.1,1.1l-0.2,1.2v0h0.6c0,0,0,0,0,0c0.9,0.1,0.9,0.9,0.9,1v1.2c-0.1,0.9-0.9,1-0.9,1
h-0.7v0.7c0,0.1-0.1,0.2-0.2,0.2c0,0-0.1,0-0.1,0c0,0-0.1,0-0.1-0.1c0,0,0,0,0,0c0,0,0,0,0,0v-3.8l0.1-5.8L15.9,32.7L15.9,32.7z
M20.2,51.7C20.3,51.7,20.3,51.7,20.2,51.7L20.2,51.7l19.8,0.1v0c0,0,0,0,0,0c0,0,0,0,0,0v-8.1c-0.1,0-0.1,0-0.2,0L39.8,45
c0,0,0,0.4-0.4,0.4c-0.3,0-2.8,0-2.8,0s-0.3,0-0.4-0.4l0-0.1v-0.1H34v-2.6h-1.7v-1l-7.3,0v1.3c0,0,0,0.2,0,0.2c0,0,0,0.3-0.3,0.3
c-0.3,0-0.3-0.3-0.3-0.3v-0.1c0,0,0,0,0,0s0,0,0,0L24.2,45c0,0-0.1,0.4-0.4,0.4c-0.3,0-2.8,0-2.8,0s-0.3,0-0.4-0.4
c0,0-0.4-2.3-0.4-2.3L20.2,51.7C20.2,51.7,20.2,51.7,20.2,51.7L20.2,51.7z M51.6,11.3l-9,6.6v-4.5H17.2v3.9l-8.7-6.5l8.7-6.6v4.5
h25.5V4.8L51.6,11.3z M40.4,42.5C40.4,42.5,40.5,42.5,40.4,42.5C40.5,42.5,40.4,42.5,40.4,42.5L40.4,42.5z M16.2,40.6h0.6
c0.4,0,0.7,0.3,0.7,0.7v1.1c0,0.4-0.3,0.7-0.7,0.7h-0.7L16.2,40.6C16.1,40.7,16.1,40.6,16.2,40.6L16.2,40.6z"/>
</svg>
Once it was converted to jpg here is output. It is just a blank plate
image.png (1.5 KB)
However, once I modify the rotation let say, 45 degree and convert it to jpg, you can see a part of the image rotated
image.png (6.1 KB)
Here is the xml of the modified to rotate 45 degrees
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 27.8.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" transform="scale(1,1) rotate(45)"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 60 60"
style="enable-background:new 0 0 60 60;" xml:space="preserve">
<style type="text/css">
.st0{fill:#4C4E4F;}
</style>
<path class="st0" d="M15.9,32.7l0.1-6.8v-0.6c0,0,0,0,0-0.1l0.6-0.6l0,0l0.9-0.7c0,0,0,0,0.1,0h0.9v0h0.2v0h0.1v-1.4
c0-0.1,0-0.1,0-0.2v-2c0-0.7,0.5-1.2,1.2-1.2h3.5c0.6,0,1.2,0.6,1.2,1.2V21h11.2v-0.7c0-0.7,0.5-1.3,1.2-1.3h3.5
c0.6,0,1.2,0.6,1.2,1.3v0.9c0,0,0,0,0,0v2.5c0,0,0,0,0,0.1v0.1h0.1v0h0.2v0h0.9c0,0,0,0,0.1,0l0.9,0.7c0,0,0,0,0,0l0.6,0.7
c0,0,0,0,0,0.1V26l0,6.7v2.5c0,0,0,0.1-0.1,0.1h-2.6v9c0,0,0,0,0,0c-0.1,0.1-0.2,0.2-0.2,0.2c0,0,0,0-0.1,0V52h0.3v2.2h-23V52H19
v-9.9h-0.1c0,0-0.1,0-0.1-0.1v-0.9l0-3.2h-2.2l-0.1,1.1l-0.2,1.2v0h0.6c0,0,0,0,0,0c0.9,0.1,0.9,0.9,0.9,1v1.2c-0.1,0.9-0.9,1-0.9,1
h-0.7v0.7c0,0.1-0.1,0.2-0.2,0.2c0,0-0.1,0-0.1,0c0,0-0.1,0-0.1-0.1c0,0,0,0,0,0c0,0,0,0,0,0v-3.8l0.1-5.8L15.9,32.7L15.9,32.7z
M20.2,51.7C20.3,51.7,20.3,51.7,20.2,51.7L20.2,51.7l19.8,0.1v0c0,0,0,0,0,0c0,0,0,0,0,0v-8.1c-0.1,0-0.1,0-0.2,0L39.8,45
c0,0,0,0.4-0.4,0.4c-0.3,0-2.8,0-2.8,0s-0.3,0-0.4-0.4l0-0.1v-0.1H34v-2.6h-1.7v-1l-7.3,0v1.3c0,0,0,0.2,0,0.2c0,0,0,0.3-0.3,0.3
c-0.3,0-0.3-0.3-0.3-0.3v-0.1c0,0,0,0,0,0s0,0,0,0L24.2,45c0,0-0.1,0.4-0.4,0.4c-0.3,0-2.8,0-2.8,0s-0.3,0-0.4-0.4
c0,0-0.4-2.3-0.4-2.3L20.2,51.7C20.2,51.7,20.2,51.7,20.2,51.7L20.2,51.7z M51.6,11.3l-9,6.6v-4.5H17.2v3.9l-8.7-6.5l8.7-6.6v4.5
h25.5V4.8L51.6,11.3z M40.4,42.5C40.4,42.5,40.5,42.5,40.4,42.5C40.5,42.5,40.4,42.5,40.4,42.5L40.4,42.5z M16.2,40.6h0.6
c0.4,0,0.7,0.3,0.7,0.7v1.1c0,0.4-0.3,0.7-0.7,0.7h-0.7L16.2,40.6C16.1,40.7,16.1,40.6,16.2,40.6L16.2,40.6z"/>
</svg>
But if you removed the the transform attribute from the svg file, the SVG to jpg is working fine. Seems that during the conversion to jpg, it is being rotated off it’s axis.
Here is the c# code
public int ConvertSVGToJPG()
{
try
{
string filename = "Original.svg";
string outputFilename = "OriginalOutput_1.jpg";
var options = new Aspose.Html.Saving.ImageSaveOptions(Aspose.Html.Rendering.Image.ImageFormat.Jpeg);
options.PageSetup.PageLayoutOptions = PageLayoutOptions.ScaleToPageWidth;
options.PageSetup.AdjustToWidestPage = true;
using (var document = new SVGDocument(filename))
{
Converter.ConvertSVG(document, options, outputFilename);
}
return 1;
}
catch (Exception ex)
{
Console.WriteLine(ex.Message);
return 0;
}
}