cancel
Showing results for 
Search instead for 
Did you mean: 
Read only

SVG Image blurred

Former Member
0 Kudos
491

Hi,

I am using an SVG image to be displayed on a pdf file.But the quality of image on pdf is not very clear.I had took printout of SVG object and pdf file and checked for the difference.SVG object printout is crystal clear and pdf printout is dotted and blurred.Is there anyway i can improve the quality of the image so generated on PDF?

regards,

Ravi Kumar.

Accepted Solutions (1)

Accepted Solutions (1)

Former Member
0 Kudos

This has to do with the size of the rendered image.

I get the same effect if I render my svg's as a jpeg at the same size as the svg (blurred). If I render it at some much larger dimension I get a much sharper image.

I imagine you may get the same effect if you created your svg at a much larger size as well. Anybody want to test this?

Former Member
0 Kudos

Hi,

Do i need to create an SVG which is small to actual rendered image or it's reverse?

Regards,

Ravi Kumar

Former Member
0 Kudos

One other question: Are you using "TSPAN" or "TEXT" elements in your SVG...if TSPANs, try changing them to "TEXT".

Former Member
0 Kudos

Hi Rick,

I had checked the SVG Object.All elements are text elements.I haven't used tspan.

Regards,

Ravi Kumar

Former Member
0 Kudos

Ravi,

I started with an svg with the dimensions(all in pixels) h = 200 w = 500 and rendered it at h = 2000 and w = 5000. This is an extreme example and you may want to experiment till you get a result you like.

I also went back to the original svg and enlarged it 200% using inkscape and got a nice sharp image rendering it at its new default size.

I also tried the geometric precision attribute witch had no noticeable effect to me, but my svgs' are not text heavy.

Former Member
0 Kudos

Hi Christian,

I haven't changed the size of the SVG object because it's a huge task as there are no. of variables to be changed(Position as well as size). But i had tried by decreasing it's size in rendered object and executed the transaction.The image size is getting decreased but output quality haven't improved much.

Regards,

Ravi Kumar.

Former Member
0 Kudos

Have you tried increasing the size of the rendered image as i suggested?

Former Member
0 Kudos

Hi Chrisitian,

I haven't increased the size of rendered image.Just give me sometime i ll do the same as u told and tell u the result.

Regards,

Ravi Kumar

Former Member
0 Kudos

Actually, you can increase the size quite easily with a transform in the SVG. You won't need to adjust all of the elements, just one.

- Rick

Former Member
0 Kudos

Hi,

I had increased the size in the SVG renderer and it's working finally.I found the improvement in the quality of output pdf.Tommorrow i will a give a little R and D on it and let you people knw.Thanks for your suggestions.........

Sincerely,

Ravi Kumar

Former Member
0 Kudos

Hi Christian,

I had increased the rendered image by 5 times and executed the transaction.Now to my surprise as you had mentioned,It's very clear now.

Sorry for not giving you more than 10 points for your suggestion.

I like to summarize this as follows.

For SVG if you use some fonts like arial which are having sharp curves if you try to render the image at the same image,You will get a dotted image.In that case if you just scale the rendered image by 5-6 times you output pdf will be having smoother curves.

Thanks for everyone who had given invaluable suggestions.

Regards,

Ravi Kumar

Answers (1)

Answers (1)

Former Member
0 Kudos

I'm guessing here, but it sounds like the svg image is being converted to some other format and placed on the pdf page. It's probably this conversion that is causing the degradation.

What if you save the SVG using the image saver first and look at it that way (before putting it on the pdf). What is the quality now? If it is not the same, perhaps use the image saver and image loader and pop the image loader output to the pdf.

Former Member
0 Kudos

Not the quality, but the size. You should make certain that the size is the exact same as the "as rendered" image. If you need scaling of the image, let the SVG engine do it, not the PDF conversion. The Animation renderer allow you to specify the size of the output image.

Former Member
0 Kudos

Hi Rick,Ryan

I had converted to .jpeg format using image saver action.it's still blurred and dotted.No difference i had found from saving into .pdf or .jpeg

While configuring Animation renderer action i had given the exact size of the rendered image.Still it's not working.

Regards,

Ravi Kumar

Former Member
0 Kudos

A few questions:

What is blurred and dotted? Text? Are you using any embedded images?

Try adding : text-rendering="geometricPrecision" to the root SVG element in your SVG file.

- Rick

sufw
Active Participant
0 Kudos

Hi Ravi,

as an aside, try to render the SVG as a PNG image file before inserting it into the PDF document. Maybe some of the image quality issues you're experiencing are due to JPEG artefacts around text and other abrupt changes in contrast - this happens for some JPEG images which use a high level of compression....

Hope this helps,

Sascha

Former Member
0 Kudos

Hi Rick,Sacha

Actually my SVG image doesn't possess any embedded images.It just consists of a text and a barcode which is to be displayed on a pdf file.I am observing the quality of the pdf to be very low after rendering.It's showing in the form of close dots.But the size of dots are huge enough to be noticed.(Pdf printout is not getting printed properly).

I had tried converting into .png and .jpeg format and observed the images.It's showing up in the same way.It may be due to sharp changes in contrast as Sacha mentioned.Is there any way in which i can improve the quality of image.I don't mine if i get the output in other format but it should be in a good printable format?

Regards,

Ravi Kumar.

Former Member
0 Kudos

What happens if you just save the image to disk? How is the image quality?

Former Member
0 Kudos

It's same as the image which is being displayed on the pdf.

Former Member
0 Kudos

OK, so what are the dimensions (height and width) of the SVG and what are the dimensions of the saved imaged?

Former Member
0 Kudos

Did you try my suggestion???

Former Member
0 Kudos

Hi Rick,

I had tried ur suggestion.but no change i had found in the output image.

Hi Ryan,

The size of SVG object is 765995 in pixels. And the size of object renderer is 765995 .No units were mentioned there.

Regards,

Ravi Kumar.

Former Member
0 Kudos

Sounds like the fonts you are using are rendering strangely at large size(s). What type of fonts are they? The text rendering "hint" should dramatically smooth the font rendering, though. You could also try the hint "optimizeLegibility".

- Rick

Former Member
0 Kudos

Rick,

I had used Arial font at size around 9 to 12(9 for ordinary texts and 12 for headings on pdf).The font also present on the xMII server.

But i had used SVG object size 765*995 pixels while rendering too....

Does this has something to do with my low quality image which i am getting now?

Regards,

Ravi Kumar.