#1 Adds ChartGrid.js file to dynamically pull in images, routes, text

src/assets/content/ChartGrid.js

+export default {
+    chartGridItems: [
+        //we'll be replacing these img_src with paths to location on s3
+        //routes will direct to appropriate subpage
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },        
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },       
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },         
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },       
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },  
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },  
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },  
+        {
+            title: '',
+            route: '/',
+            img_src: 'src/assets/images/sampleChart.PNG',
+            alt: ''
+        },  
+    ]
+};
\ No newline at end of file

src/components/ChartGrid.vue

 <template>
     <div id="chartGrid" class="padded">
-        <!-- When we get actual charts, we can pull all the info and urls in from a js file and loop through
-        like in the VizLab home site -->
-            <a href="/"> <!-- Populate hrefs with relative routes -->
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
-            <a href="/">
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
-            <a href="/">
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
-            <a href="/">
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
-            <a href="/">
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
-            <a href="/">
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
-            <a href="/">
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
-            <a href="/">
-                <div class="chart">
-                    <img :src="sampleChart" alt=""/>
-                </div>
-            </a>
+        <a v-for="(item, index) in chartContent" :key="index" :href="item.route">
+            <div class="chart">
+                <img :src="item.img_src" alt=""/>
+            </div>
+        </a>
     </div>
 </template>
 
 <script>
-import sampleChart from '@/assets/images/sampleChart.PNG';
+import ChartGrid from '@/assets/content/ChartGrid.js';
 
 export default {
-    data() {
-        return {
-            sampleChart
-        };
-    }
+  data() {
+    return {
+      chartContent: ChartGrid.chartGridItems
+    };
+  }
 };
+
 </script>
 
 <style>