diff --git a/lib/pixi/scatter-resolution-2.html b/lib/pixi/scatter-resolution-2.html
index a348983..8353bd9 100644
--- a/lib/pixi/scatter-resolution-2.html
+++ b/lib/pixi/scatter-resolution-2.html
@@ -11,94 +11,123 @@
     </head>
 
     <body>
-        <canvas id="canvas2" class="interactive">Canvas not supported</canvas>
+        <canvas id="canvas" />
         <script>
-            class ScatterApp extends PIXIApp {
-                setup() {
-                    super.setup()
-                    // Obey order in which ScatterContainer are created because the
-                    // InteractionMapper register event handlers in a first come first serve
-                    // order
-                    this.scatterContainerFront = new ScatterContainer(this.renderer, { app: this })
-                    this.scatterContainerBack = new ScatterContainer(this.renderer, { app: this })
+            const app = new PIXIApp({
+                view: canvas,
+                roundPixels: true,
+                resolution: 2
+            })
+                .setup()
+                .run()
 
-                    // Note that the addChild order is different because later children
-                    // are placed in front of earlier children.
-                    this.scene.addChild(this.scatterContainerBack)
-                    this.scene.addChild(this.scatterContainerFront)
+            app.loadSprites(
+                [
+                    '../examples/front__1_dpi75.png',
+                    '../examples/front__1_dpi150.png',
+                    '../examples/front__1_dpi300.png',
+                    '../examples/front__1_dpi600.png',
+                    '../examples/front__1_dpi1200.png'
+                ],
+                sprites => {
+                    app.scatterContainerFront = new ScatterContainer(app.renderer, { app })
+                    app.scatterContainerBack = new ScatterContainer(app.renderer, { app })
+
+                    app.scene.addChild(app.scatterContainerBack)
+                    app.scene.addChild(app.scatterContainerFront)
 
                     let startScale = 0.5
 
-                    // Add the queen to ScatterContainer one
-                    let sprite1 = PIXI.Sprite.from('../examples/front__1_dpi75.png')
+                    // sprite1
+                    //--------------------
+                    let sprite1 = sprites.get('../examples/front__1_dpi75.png')
                     sprite1.interactive = true
-                    let scatter1 = new DisplayObjectScatter(sprite1, this.renderer, {
+                    let scatter1 = new DisplayObjectScatter(sprite1, app.renderer, {
                         x: 20,
                         y: 20,
                         startScale,
                         minScale: 0.01,
                         maxScale: 5.0
                     })
-                    this.scatterContainerBack.addChild(sprite1)
+                    app.scatterContainerBack.addChild(sprite1)
 
-                    // Add the king to ScatterContainer two
-                    let sprite2 = PIXI.Sprite.from('../examples/front__1_dpi150.png')
+                    // sprite2
+                    //--------------------
+                    let sprite2 = sprites.get('../examples/front__1_dpi150.png')
                     sprite2.interactive = true
-                    let scatter2 = new DisplayObjectScatter(sprite2, this.renderer, {
+                    let scatter2 = new DisplayObjectScatter(sprite2, app.renderer, {
                         x: 320,
                         y: 20,
                         startScale: 0.5 * startScale,
                         minScale: 0.01,
                         maxScale: 5.0
                     })
-                    this.scatterContainerFront.addChild(sprite2)
+                    app.scatterContainerFront.addChild(sprite2)
 
-                    // Add the queen to ScatterContainer one
-                    let sprite3 = PIXI.Sprite.from('../examples/front__1_dpi300.png')
+                    // sprite3
+                    //--------------------
+                    let sprite3 = sprites.get('../examples/front__1_dpi300.png')
                     sprite3.interactive = true
-                    let scatter3 = new DisplayObjectScatter(sprite3, this.renderer, {
+                    let scatter3 = new DisplayObjectScatter(sprite3, app.renderer, {
                         x: 620,
                         y: 20,
                         startScale: 0.25 * startScale,
                         minScale: 0.01,
                         maxScale: 5.0
                     })
-                    this.scatterContainerBack.addChild(sprite3)
+                    app.scatterContainerBack.addChild(sprite3)
 
-                    // Add the king to ScatterContainer two
-                    let sprite4 = PIXI.Sprite.from('../examples/front__1_dpi600.png')
+                    // sprite4
+                    //--------------------
+                    let sprite4 = sprites.get('../examples/front__1_dpi600.png')
                     sprite4.interactive = true
-                    let scatter4 = new DisplayObjectScatter(sprite4, this.renderer, {
+                    let scatter4 = new DisplayObjectScatter(sprite4, app.renderer, {
                         x: 920,
                         y: 20,
                         startScale: 0.125 * startScale,
                         minScale: 0.01,
                         maxScale: 5.0
                     })
-                    this.scatterContainerFront.addChild(sprite4)
+                    app.scatterContainerFront.addChild(sprite4)
 
-                    // Add the king to ScatterContainer two
-                    let sprite5 = PIXI.Sprite.from('../examples/front__1_dpi1200.png')
+                    // sprite5
+                    //--------------------
+                    let sprite5 = sprites.get('../examples/front__1_dpi1200.png')
                     sprite5.interactive = true
-                    let scatter5 = new DisplayObjectScatter(sprite5, this.renderer, {
+                    let scatter5 = new DisplayObjectScatter(sprite5, app.renderer, {
                         x: 1220,
                         y: 20,
                         startScale: 0.0625 * startScale,
                         minScale: 0.01,
                         maxScale: 5.0
                     })
-                    this.scatterContainerFront.addChild(sprite5)
-                    return this
-                }
-            }
+                    app.scatterContainerFront.addChild(sprite5)
 
-            const scatterApp = new ScatterApp({
-                view: canvas2,
-                roundPixels: true,
-                resolution: 2
-            })
-                .setup()
-                .run()
+                    // renderTexture
+                    //--------------------
+                    sprites.forEach(value => {
+                        
+                        const matrix = new PIXI.Matrix()
+                        matrix.translate(-value.x, -value.y)
+
+                        const texture = PIXI.RenderTexture.create({ width: value.width, height: value.height, resolution: 2 })
+                        app.renderer.render(value, texture, true, matrix)
+
+                        const sprite = new PIXI.Sprite(texture)
+                        sprite.interactive = true
+
+                        new DisplayObjectScatter(sprite, app.renderer, {
+                            x: value.x,
+                            y: 400,
+                            minScale: 0.01,
+                            maxScale: 5.0
+                        })
+
+                        app.scatterContainerFront.addChild(sprite)
+                    })
+                },
+                { resolutionDependent: false }
+            )
         </script>
     </body>
 </html>
