diff --git a/README.md b/README.md
index 8e134bf8..81c41d72 100644
--- a/README.md
+++ b/README.md
@@ -10,11 +10,11 @@ Dimensional charting built to work natively with crossfilter rendered using d3.j
 
 #### Tweets Dataset: Brushing on timeline and hovering on Pointmap datapoint which displays row information
 
-![example2](https://cloud.githubusercontent.com/assets/2932405/25641746/acd9cdd0-2f4a-11e7-9821-99e3152075cd.gif)
+![example2](https://user-images.githubusercontent.com/4845281/28191946-21bb7ec0-67e8-11e7-855e-8922939d1241.gif)
 
 #### Tweets Dataset: Using MapD-Draw tool on pointmap to select specific areas on a map
 
-![example5](https://cloud.githubusercontent.com/assets/2932405/25641955/ab7015ac-2f4b-11e7-848a-c749fe2081bf.gif)
+![example5](https://user-images.githubusercontent.com/4845281/28191947-21bd2ad6-67e8-11e7-9c8d-a5ddcd0f07fc.gif)
 
 # Examples
 
diff --git a/example/example2.html b/example/example2.html
index 28cf9224..58c37e35 100644
--- a/example/example2.html
+++ b/example/example2.html
@@ -115,7 +115,7 @@
 
      We then pass this scale into the r function within bubbleRasterChart
     */
-    var sizeScale = d3.scale.linear().domain([0,5000]).range([2,12]);
+    var sizeScale = d3.scale.linear().domain([0,5000]).range([1,5]);
 
     var pointMapChart = dc
     .rasterChart(parent, true)
diff --git a/example/example4.js b/example/example4.js
index 4ee74c28..d5ad657f 100644
--- a/example/example4.js
+++ b/example/example4.js
@@ -101,7 +101,7 @@ document.addEventListener("DOMContentLoaded", function init() {
        *
        * We then pass this scale into the r function within bubbleRasterChart
        */
-      var rScale = d3.scale.linear().domain([0,5000]).range([2,12]);
+      var rScale = d3.scale.linear().domain([0,5000]).range([1,5]);
 
       pointMapChart = dc.bubbleRasterChart(parent, false)
                               .con(con)
diff --git a/example/example5.html b/example/example5.html
index e6dba2e2..2878187b 100644
--- a/example/example5.html
+++ b/example/example5.html
@@ -80,7 +80,7 @@
     var xDim = crossFilter.dimension("lon");
     var yDim = crossFilter.dimension("lat");
     var parent = document.getElementById("chart1-example");
-    var rScale = d3.scale.linear().domain([0,5000]).range([2,12]);
+    var rScale = d3.scale.linear().domain([0,5000]).range([1,5]);
     mapLangColors(40);
 
     var pointMapChart = dc.rasterChart(parent, true, null, mapboxgl)
diff --git a/example/index.html b/example/index.html
index 03d5d63d..e63a83d7 100644
--- a/example/index.html
+++ b/example/index.html
@@ -99,7 +99,7 @@
           <a href="./example2.html">
           Backend-rendered Point Map (Tweets Dataset)
           <br>
-          <img src="https://cloud.githubusercontent.com/assets/2932405/25759330/d287763e-3186-11e7-80fc-8ef84d046aec.png">
+          <img src="https://user-images.githubusercontent.com/4845281/28191946-21bb7ec0-67e8-11e7-855e-8922939d1241.gif">
           </a>
         </td>
       </tr>
@@ -117,7 +117,7 @@
         <a href="./example4.html">
         Backend-rendered Scatter Plot (Tweets Dataset)
         <br>
-        <img src="https://cloud.githubusercontent.com/assets/2932405/25759388/2d8e9aee-3187-11e7-86f3-78e0e5b92b06.png">
+        <img src="https://user-images.githubusercontent.com/4845281/28191948-21be4150-67e8-11e7-8221-35c59f51df80.gif">
         </a>
         </td>
       </tr>
@@ -125,9 +125,9 @@
         <td scope="row"><a href="./example5.html">
         Selection Tool With Raster Chart
         <br>
-        <img src="https://cloud.githubusercontent.com/assets/2932405/25759496/9f039224-3187-11e7-8b05-d6ab3179727d.png">
+        <img src="https://user-images.githubusercontent.com/4845281/28191947-21bd2ad6-67e8-11e7-9c8d-a5ddcd0f07fc.gif">
         </a></td>
-        
+
       </tr>
       <tr>
         <td scope="row"><a href="./exampleMultiLayerMap.html">