diff --git a/player/index.html b/player/index.html
index 0b80e38..19d2bd6 100644
--- a/player/index.html
+++ b/player/index.html
@@ -54,6 +54,10 @@
     <script src="js/module.js"></script>
     <!-- endbuild -->
     <!-- <script src="bodymovin.js"></script> -->
+    <script src="exports/blue/data.js"></script>
+    <script src="exports/blue/anim1Data.js"></script>
+    <script src="exports/blue/time_0.js"></script>
+    <script src="exports/blue/anim2Data.js"></script>
 </head>
 <body>
 
@@ -72,14 +76,18 @@
 
     var animData = {
         wrapper: document.getElementById('bodymovin'),
-        animType: 'svg',
+        animType: 'canvas',
         loop: true,
         prerender: false,
         autoplay: true,
-        path: 'exports/bm'
+        animationData: anim1Data
+        //path: 'exports/bm'
     };
     bodymovin.setQuality(50);
     var anim = bodymovin.loadAnimation(animData);
+    setTimeout(function(){
+        anim.includeLayers(anim2Data);
+    },500);
     anim.addEventListener('bm:config_ready', configReady);
     anim.addEventListener('bm:data_ready', dataReady);
 </script>
diff --git a/player/js/animation/AnimationItem.js b/player/js/animation/AnimationItem.js
index 1718958..18c1270 100644
--- a/player/js/animation/AnimationItem.js
+++ b/player/js/animation/AnimationItem.js
@@ -130,13 +130,21 @@
     var newLayers = data.layers;
     var j, jLen = newLayers.length;
     for(j=0;j<jLen;j+=1){
-        i = 0;
-        while(i<len){
-            if(layers[i].id == newLayers[j].id){
-                layers[i] = newLayers[j];
-                break;
+        if(!newLayers[j].id){
+            if(this.animType == 'svg'){
+                layers.push(newLayers[j]);
+            }else{
+                layers.unshift(newLayers[j]);
             }
-            i += 1;
+        }else{
+            i = 0;
+            while(i<len){
+                if(layers[i].id == newLayers[j].id){
+                    layers[i] = newLayers[j];
+                    break;
+                }
+                i += 1;
+            }
         }
     }
     if(data.assets){
diff --git a/player/js/renderers/CanvasRenderer.js b/player/js/renderers/CanvasRenderer.js
index a6baa33..76de194 100644
--- a/player/js/renderers/CanvasRenderer.js
+++ b/player/js/renderers/CanvasRenderer.js
@@ -67,20 +67,30 @@
     if(!elements){
         elements = this.elements;
     }
-    var j, jLen = elements.length, elems, placeholder;
+    var j, jLen = elements.length, elems;
     for(i=0;i<len;i+=1){
-        j = 0;
-        while(j<jLen){
-            if(elements[j].data.id == layers[i].id){
-                elements[j] = this.createItem(layers[i],parentContainer);
-                if (layers[i].ty === 0) {
-                    elems = [];
-                    this.buildItems(layers[i].layers,elems);
-                    elements[j].setElements(elems);
-                }
-                break;
+        if(!layers[i].id){
+            var elem = this.createItem(layers[i],parentContainer);
+            elements.unshift(elem);
+            if (layers[i].ty === 0) {
+                elems = [];
+                this.buildItems(layers[i].layers,elems);
+                elem.setElements(elems);
             }
-            j += 1;
+        }else{
+            j = 0;
+            while(j<jLen){
+                if(elements[j].data.id == layers[i].id){
+                    elements[j] = this.createItem(layers[i],parentContainer);
+                    if (layers[i].ty === 0) {
+                        elems = [];
+                        this.buildItems(layers[i].layers,elems);
+                        elements[j].setElements(elems);
+                    }
+                    break;
+                }
+                j += 1;
+            }
         }
     }
 };
diff --git a/player/js/renderers/SVGRenderer.js b/player/js/renderers/SVGRenderer.js
index 69309f2..93a12eb 100644
--- a/player/js/renderers/SVGRenderer.js
+++ b/player/js/renderers/SVGRenderer.js
@@ -60,19 +60,29 @@
     }
     var j, jLen = elements.length, elems, placeholder;
     for(i=0;i<len;i+=1){
-        j = 0;
-        while(j<jLen){
-            if(elements[j].data.id == layers[i].id){
-                placeholder = elements[j];
-                elements[j] = this.createItem(layers[i],parentContainer, placeholder);
-                if (layers[i].ty === 0) {
-                    elems = [];
-                    this.buildItems(layers[i].layers,elements[j].getDomElement(),elems, placeholder);
-                    elements[j].setElements(elems);
-                }
-                break;
+        if(!layers[i].id){
+            var elem = this.createItem(layers[i],parentContainer);
+            elements.push(elem);
+            if (layers[i].ty === 0) {
+                elems = [];
+                this.buildItems(layers[i].layers,elem.getDomElement(),elems);
+                elem.setElements(elems);
             }
-            j += 1;
+        }else{
+            j = 0;
+            while(j<jLen){
+                if(elements[j].data.id == layers[i].id){
+                    placeholder = elements[j];
+                    elements[j] = this.createItem(layers[i],parentContainer, placeholder);
+                    if (layers[i].ty === 0) {
+                        elems = [];
+                        this.buildItems(layers[i].layers,elements[j].getDomElement(),elems, placeholder);
+                        elements[j].setElements(elems);
+                    }
+                    break;
+                }
+                j += 1;
+            }
         }
     }
 };