So basically what I need to do is to load an SVG with SNAP.svg and add an effect (zoom in) I understand that in order to achieve this I need to respect this :

* Load the SVG file
* Scale de SVG in (0 ?)
* Append this SVG
* Add a transform effect (with the suitable scale)

The problem is that I need to display this in a 650 width and 280 height size.

The SVG I'm loading, witch I'll name it 'map' is in 1920 width and 1080 height.

This is my code so far :

```
    <svg id="svg" width="650px" height="280px"></svg>
    <script type="text/javascript">
        var s = Snap("#svg");

        var map = Snap.load("./src/map.svg", function (f) {
                        g = f.select("g");
                        var t = Snap.matrix().scale(0.35);
                        s.append(g);
                        g.group(g.selectAll("path")).transform(t);  
                    });
    </script>

```

It seems the scale instruction is working find but not the animation. 
Also, how I can center this loaded SVG not matter what scale it takes ?

Thank you !

**UPDATE :**

I managed to add some effects but I don't think the way I'm doing it it's the correct one :

```
            var carte = Snap.load("./src/carte.svg", function (f) {
                        g = f.select("g");
                        //var t = Snap.matrix().scale(0.35);
                        s.append(g);
                        //Set the map in first position
                        var firstScene = new Snap.Matrix();
                        firstScene.translate(300, 160);
                        firstScene.scale(0.05);

                        //Zoom effect
                        var secondScene = new Snap.Matrix();
                            secondScene.scale(2.0);
                            secondScene.translate(-850, -360);

                        //Move the matrix till desired point (not finish)
                        var threeScene = new Snap.Matrix();
                            threeScene.translate(-850, -360);

                        g.animate({ transform: firstScene }, 0, function() {g.animate ({ transform: secondScene}, 1500, mina.linear )});

                    });

```

It seems impossible to add a timer or more than two effects ?