From d59b7cceed7de5bbe9d84e416b53b8aba9ec7180 Mon Sep 17 00:00:00 2001
From: Paul C Pederson <ppederson@esri.com>
Date: Wed, 17 Sep 2014 14:41:16 -0700
Subject: [PATCH] fix banner graphic, example of ng-repeat

---
 documentation/partials/line-graph.md        | 20 ++++++++++++++++++++
 site/css/home.css                           |  2 +-
 site/documentation/partials/line-graph.html | 17 +++++++++++++++++
 site/index.html                             | 13 ++++++++-----
 site/js/controllers.js                      |  1 +
 site/scss/home.scss                         |  2 +-
 6 files changed, 48 insertions(+), 7 deletions(-)

diff --git a/documentation/partials/line-graph.md b/documentation/partials/line-graph.md
index 3189c05..ec3e847 100644
--- a/documentation/partials/line-graph.md
+++ b/documentation/partials/line-graph.md
@@ -46,4 +46,24 @@
   <line field="Owner" value="Black Mesa"></line>
   <line field="Owner" value="Tyrell Corp"></line>
 </graph>
+```
+
+## Inside ng-repeat
+<div class="white-panel" ng-repeat="one in arrayOfData">
+  <graph data="one.data" width="100%" height="600px">
+    <x field="Month" order-by="Date"></x>
+    <y field="Unit Sales"></y>
+    <legend></legend>
+    <line field="Owner"></line>
+  </graph>
+</div>
+
+```html
+<!-- Default -->
+<graph data="graphData" width="100%" height="600px">
+  <x field="Month" order-by="Date"></x>
+  <y field="Unit Sales"></y>
+  <legend></legend>
+  <line field="Owner"></line>
+</graph>
 ```
\ No newline at end of file
diff --git a/site/css/home.css b/site/css/home.css
index 03a54c1..0935b24 100644
--- a/site/css/home.css
+++ b/site/css/home.css
@@ -42,7 +42,7 @@ code {
   font-weight: 200;
 }
 /* line 39, ../scss/home.scss */
-.banner .dimple-graph {
+.banner .banner-graphic {
   position: absolute;
   top: -260px;
   bottom: 0;
diff --git a/site/documentation/partials/line-graph.html b/site/documentation/partials/line-graph.html
index 3c5d521..c8f190d 100644
--- a/site/documentation/partials/line-graph.html
+++ b/site/documentation/partials/line-graph.html
@@ -41,3 +41,20 @@ <h2>
   <span class="tag">&lt;<span class="title">line</span> <span class="attribute">field</span>=<span class="value">"Owner"</span> <span class="attribute">value</span>=<span class="value">"Black Mesa"</span>&gt;</span><span class="tag">&lt;/<span class="title">line</span>&gt;</span>
   <span class="tag">&lt;<span class="title">line</span> <span class="attribute">field</span>=<span class="value">"Owner"</span> <span class="attribute">value</span>=<span class="value">"Tyrell Corp"</span>&gt;</span><span class="tag">&lt;/<span class="title">line</span>&gt;</span>
 <span class="tag">&lt;/<span class="title">graph</span>&gt;</span></code></pre>
+<h2 id="inside-ng-repeat">Inside ng-repeat</h2>
+<div class="white-panel" ng-repeat="one in arrayOfData">
+  <graph data="one.data" width="100%" height="600px">
+    <x field="Month" order-by="Date"></x>
+    <y field="Unit Sales"></y>
+    <legend></legend>
+    <line field="Owner"></line>
+  </graph>
+</div>
+
+<pre><code class="lang-html"><span class="comment">&lt;!-- Default --&gt;</span>
+<span class="tag">&lt;<span class="title">graph</span> <span class="attribute">data</span>=<span class="value">"graphData"</span> <span class="attribute">width</span>=<span class="value">"100%"</span> <span class="attribute">height</span>=<span class="value">"600px"</span>&gt;</span>
+  <span class="tag">&lt;<span class="title">x</span> <span class="attribute">field</span>=<span class="value">"Month"</span> <span class="attribute">order-by</span>=<span class="value">"Date"</span>&gt;</span><span class="tag">&lt;/<span class="title">x</span>&gt;</span>
+  <span class="tag">&lt;<span class="title">y</span> <span class="attribute">field</span>=<span class="value">"Unit Sales"</span>&gt;</span><span class="tag">&lt;/<span class="title">y</span>&gt;</span>
+  <span class="tag">&lt;<span class="title">legend</span>&gt;</span><span class="tag">&lt;/<span class="title">legend</span>&gt;</span>
+  <span class="tag">&lt;<span class="title">line</span> <span class="attribute">field</span>=<span class="value">"Owner"</span>&gt;</span><span class="tag">&lt;/<span class="title">line</span>&gt;</span>
+<span class="tag">&lt;/<span class="title">graph</span>&gt;</span></code></pre>
diff --git a/site/index.html b/site/index.html
index f3d602b..d43b30d 100644
--- a/site/index.html
+++ b/site/index.html
@@ -70,11 +70,14 @@
         </div>
       </nav>
 
-      <graph data="graphData" width="2400" height="800" class="blue-graph">
-        <x field="Month" order-by="Date" type="Category"></x>
-        <y field="Unit Sales" type="Measure" title=""></y>
-        <line field="Owner"></line>
-      </graph>
+      <div class="banner-graphic">
+        <graph data="graphData" width="2400" height="800" class="blue-graph">
+          <x field="Month" order-by="Date" type="Category"></x>
+          <y field="Unit Sales" type="Measure" title=""></y>
+          <line field="Owner"></line>
+        </graph>
+      </div>
+
       <div class="banner-copy">
         <div class="container">
           <div class="row">
diff --git a/site/js/controllers.js b/site/js/controllers.js
index 673d6db..e81dd52 100644
--- a/site/js/controllers.js
+++ b/site/js/controllers.js
@@ -33,6 +33,7 @@ angular.module('myApp.controllers', [])
 .controller('lineGraphController', ['$scope', 'dataService', function($scope, dataService) {
   dataService.getData().then(function(response) {
     $scope.graphData = response.data;
+    $scope.arrayOfData = [{data: response.data}, {data: response.data}];
   });
 }])
 
diff --git a/site/scss/home.scss b/site/scss/home.scss
index d4e3a44..dcbbb5d 100644
--- a/site/scss/home.scss
+++ b/site/scss/home.scss
@@ -36,7 +36,7 @@ code {
     z-index: 2;
     font-weight: 200;
   }
-  .dimple-graph {
+  .banner-graphic {
     position: absolute;
     top: -260px;
     bottom: 0;