diff --git a/lib/examples/front__1_dpi1200.png b/lib/examples/front__1_dpi1200.png
new file mode 100644
index 0000000..8e37b50
Binary files /dev/null and b/lib/examples/front__1_dpi1200.png differ
diff --git a/lib/examples/front__1_dpi150.png b/lib/examples/front__1_dpi150.png
new file mode 100755
index 0000000..5c9775b
Binary files /dev/null and b/lib/examples/front__1_dpi150.png differ
diff --git a/lib/examples/front__1_dpi300.png b/lib/examples/front__1_dpi300.png
new file mode 100755
index 0000000..1505876
Binary files /dev/null and b/lib/examples/front__1_dpi300.png differ
diff --git a/lib/examples/front__1_dpi600.png b/lib/examples/front__1_dpi600.png
new file mode 100755
index 0000000..8334521
Binary files /dev/null and b/lib/examples/front__1_dpi600.png differ
diff --git a/lib/examples/front__1_dpi75.png b/lib/examples/front__1_dpi75.png
new file mode 100755
index 0000000..76f280b
Binary files /dev/null and b/lib/examples/front__1_dpi75.png differ
diff --git a/lib/pixi/scatter-resolution-2.html b/lib/pixi/scatter-resolution-2.html
new file mode 100644
index 0000000..a348983
--- /dev/null
+++ b/lib/pixi/scatter-resolution-2.html
@@ -0,0 +1,104 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
+        <title>PIXI Scatter Resolution Doctest</title>
+
+        <script src="../../dist/iwmlib.3rdparty.js"></script>
+        <script src="../../dist/iwmlib.js"></script>
+        <script src="../../dist/iwmlib.pixi.js"></script>
+    </head>
+
+    <body>
+        <canvas id="canvas2" class="interactive">Canvas not supported</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 })
+
+                    // 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)
+
+                    let startScale = 0.5
+
+                    // Add the queen to ScatterContainer one
+                    let sprite1 = PIXI.Sprite.from('../examples/front__1_dpi75.png')
+                    sprite1.interactive = true
+                    let scatter1 = new DisplayObjectScatter(sprite1, this.renderer, {
+                        x: 20,
+                        y: 20,
+                        startScale,
+                        minScale: 0.01,
+                        maxScale: 5.0
+                    })
+                    this.scatterContainerBack.addChild(sprite1)
+
+                    // Add the king to ScatterContainer two
+                    let sprite2 = PIXI.Sprite.from('../examples/front__1_dpi150.png')
+                    sprite2.interactive = true
+                    let scatter2 = new DisplayObjectScatter(sprite2, this.renderer, {
+                        x: 320,
+                        y: 20,
+                        startScale: 0.5 * startScale,
+                        minScale: 0.01,
+                        maxScale: 5.0
+                    })
+                    this.scatterContainerFront.addChild(sprite2)
+
+                    // Add the queen to ScatterContainer one
+                    let sprite3 = PIXI.Sprite.from('../examples/front__1_dpi300.png')
+                    sprite3.interactive = true
+                    let scatter3 = new DisplayObjectScatter(sprite3, this.renderer, {
+                        x: 620,
+                        y: 20,
+                        startScale: 0.25 * startScale,
+                        minScale: 0.01,
+                        maxScale: 5.0
+                    })
+                    this.scatterContainerBack.addChild(sprite3)
+
+                    // Add the king to ScatterContainer two
+                    let sprite4 = PIXI.Sprite.from('../examples/front__1_dpi600.png')
+                    sprite4.interactive = true
+                    let scatter4 = new DisplayObjectScatter(sprite4, this.renderer, {
+                        x: 920,
+                        y: 20,
+                        startScale: 0.125 * startScale,
+                        minScale: 0.01,
+                        maxScale: 5.0
+                    })
+                    this.scatterContainerFront.addChild(sprite4)
+
+                    // Add the king to ScatterContainer two
+                    let sprite5 = PIXI.Sprite.from('../examples/front__1_dpi1200.png')
+                    sprite5.interactive = true
+                    let scatter5 = new DisplayObjectScatter(sprite5, this.renderer, {
+                        x: 1220,
+                        y: 20,
+                        startScale: 0.0625 * startScale,
+                        minScale: 0.01,
+                        maxScale: 5.0
+                    })
+                    this.scatterContainerFront.addChild(sprite5)
+                    return this
+                }
+            }
+
+            const scatterApp = new ScatterApp({
+                view: canvas2,
+                roundPixels: true,
+                resolution: 2
+            })
+                .setup()
+                .run()
+        </script>
+    </body>
+</html>
