title: How to plot a Real time graph in Zeppelin?
body: <p>I am trying to use zeppelin to plot a realtime graph. I have doing a sentiment analysis on tweets on per minute . I am able to query statically and plot a graph. But i would like this to be done dynamically. I am new to zeppelin and do not have much knowledge about angularJS. What should be the correct approach to this problem?</p>
  
  <pre><code> val final_score=uni_join.map{case((year,month,day,hour,minutes),(tweet_count,sentiment))=&gt;(year, month, day, hour, minutes(sentiment/tweet_count).ceil)}
  
  
  final_score.saveToCassandra("twitter", "score",writeConf = WriteConf(ttl = TTLOption.constant(1000)))
  
  final_score.foreachRDD(score =&gt; {
  val rowRDD =score.map{case(year,month,day,hour,minutes,sentiment) =&gt;(year,month,day,hour,minutes,sentiment) }
    val tempDF = sqlContext.createDataFrame(rowRDD)
  
     z.angularBindGlobal("stream", parsed) //to bind parsed to stream.
     tempDF.registerTempTable("realTimeTable")
  })
  </code></pre>
  
  <p>Doing a query on the above table , i am able to get the graph. But i would like to dynamically update the graph every minute in order to keep in sync with the sentiment score . 
  Thanks prior. 
  [update] the angular part for the zeppelin notebook are as follows: </p>
  
  <pre><code>%angular
  &lt;div id="graph"  style="height: 100%; width: 100%"&gt;
  &lt;canvas id="myChart" width="400" height="400"&gt;&lt;/canvas&gt;
  &lt;div id="legendDiv"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;script&gt;
  function initMap() {
  
  var colorList = ["#fde577", "#ff6c40", "#c72a40", "#520833", "#a88399"]
  
  
  var el = angular.element($('#stream'));
  
  console.log("El is "+el) //returns el as object
  
  angular.element(el).ready(function() {
      console.log('Hello')
      window.locationWatcher =el.$scope.$watch('stream', function(new, old){
  console.log('changed');}, true)})
  &lt;/script&gt;
  </code></pre>
  
  <p>But running this code keeps returning the following error. </p>
  
  <pre><code>vendor.js:29 jQuery.Deferred exception: Cannot read property '$watch' of  undefined TypeError: Cannot read property '$watch' of undefined
  </code></pre>
  
  <p>The spark version that i am using is 1.6
  And Zeppelin is 0.6</p>