Download SVG images from website with Java

Question

I'm trying to download some images from a website. I've been using Jsoup to do some scraping and have successfully downloaded images given a url before but the images on this website are in svg format. There is no link to a location where the svg file is located, the image is embedded in svg tags. I have seen Batik used for converting svg files to other image formats but I don't have the svg file available.

Is there any way to do this? Would appreciate any guidance. Thank you.

Answer 1

Typically an SVG image is not a file, but rather it is included in the response body of the GET request from a browser. What you can do to test this is to download a REST client, POSTMAN if you're using Chrome, and issue a GET request to the url of the svg. The response will be the SVG image. Thinking now in terms of Java, you may have to do some parsing in your code to grab just the actual svg element because the website may return extra junk wrapping the embedded svg.

I have used Batik and I think it's not a good solution for many reasons for what you're trying to do. In the past I ended up writing Java code that executed a 3rd party program for image conversion. It was basically a Command class that wrapped the execution of phantomjs. Download phantomjs, and use the rasterize.js file in the examples folder to achieve quick and easy image conversion from .svg to .png or .jpg. At the command line, the command for phantomjs is something like:

phantomjs rasterize.js C:\sourceImage.svg C:\outputImage.png

If you are doing image manipulation, I did it a lot using ImageMagick as phantomjs is only good for rendering svg to a rasterized image format.

In your case what you want to do is for every svg image at the url, GET the svg, parse it into a String, write that String to a file, then do something like:

String command = "C:\\phantomjs\\phantomjs.exe C:\\phantomjs\\rasterize.js C:\\source.svg C:\\output.png"
Process process = Runtime.getRuntime().exec(command);

Obviously make your code more general, replacing the values in the command string with resusable variables.

If this is in the context of a commercial platform, you can install phantomjs and your java app on a single server, and then just connect this app via REST endpoints to your svg finder app that gets the images. When your svg finder app gets an image, have it parse it, format it, then POST it to the phantomjs server for rendering and uploading/storage.

Answer 2

Just save the part of the HTML file between the <svg> tags (including the <svg> ). Give it a .svg extension. You should then be able to open it in a browser, or pass it to Batik, ImageMagick or some other converter.