Making SVG Image Responsive Using Raphael

Question

I have an SVG image of African Continent, that I would like to make responsive, the image is 1500px by 1500px. and I use the ImportSVG library extension of Rapheal to utilize my SVG:

jQuery(document).ready(function () {
    jQuery.ajax({
        type: "GET",
        url: "Content/Blank_Map-Africa.svg",
        dataType: "xml",
        success: function (svgXML) {
            var paper = Raphael(150, 150, 1500, 1500);

            var newSet = paper.importSVG(svgXML);

            var world = paper.setFinish();
        }
    });
});

I have found this library, but not sure how I would include it in my project.

possible duplicate of [How Can i scale Raphael js elements on window resize using jquery](http://stackoverflow.com/questions/11176396/how-can-i-scale-raphael-js-elements-on-window-resize-using-jquery) — givanse, Oct 03 '14 at 14:00

score 3 · Accepted Answer · edited May 23 '17 at 12:21

3

here is a similar question:

Cross-browser SVG in responsive or fluid layout?

I believe using the Article mentioned would solve your issue

edited May 23 '17 at 12:21

Community

1
1

answered Aug 30 '13 at 06:02

Jacques Bronkhorst

1,685
6
34
64

Making SVG Image Responsive Using Raphael

1 Answers1