anchor.diff:  This will also make adhoc development quicker/easier with components that can render Hawkular Metrics charts with very
   little effort.
   
  +
  +== Quickstart
  +
  +The quickest way to start using the charts is to fire up a http server and start playing with the code. To run the
  + examples, start an http server from the _hawkular-charts_ root directory:
  +
  + `python -m SimpleHTTPServer 8000 .`
  +
  +Then start playing around the the examples (each has data in the example):
  +
  +* http://rawgit.com/hawkular/hawkular-charts/master/metrics-chart-sample.html.js[metrics-chart-sample.html.js]
  +* http://rawgit.com/hawkular/hawkular-charts/master/multi-chart-sample.html.js[multi-chart-sample.html.js[]
  +* http://rawgit.com/hawkular/hawkular-charts/master/avail-test.html.js[avail-test.html.js]
  +
  +These controls are currently being used in the Hawkular Console to view various metrics charts displayed there.
  +Please see https://github.com/hawkular/hawkular/tree/master/console for more real examples.
  +
   == Charts
  +
  +=== Chart Types
  +
  +Chart types are set via the *chart-type* attribute of the *hawkular-chart* directive.
  +The following chart types are available:
  +
  +* *histogram:* histogram bar chart (used in Hawkular GC chart)
  +* *area:* standard area chart with hawkular extensions
  +* *scatter:* regular scatter plot supporting avg/high/low
  +* *hawkularline:* line chart with settings defaulted to hawkular project
  +* *hawkularmetric:* specifically tailored toward Single Metrics Display
  +* *multiline:* specifically made for display multiple metrics in a singe graph
  +* *rhqbar:* http://rhq-project.github.io/rhq/[RHQ/JON] style graphs https://docs.jboss.org/author/display/RHQ/d3+Charts
  +
  +All of the chart types are either in the process of being approved by Red Hat UxD, or have been approved.
  +
   
   ==== Metrics Chart Type
   image::img/hawkular-metric-charts.png[Hawkular Metrics Chart Type]
  
positive.code: The nice part of about using angular in the charting framework is that whenever the underlying data changes, watchers automatically load and re-render the chart (as well as any of the properties that may have changed like chart-type).
  This results in less code and more productivity.
  
  .Prerequisite setup:
  . Add the hawkular-charts.css to the main index.html page
  . Add the hawkular-charts.js to the main index.html page
  . Add the charting module to the application module: `app.module('myApp', ['hawkular.charts']);`
  
negative.code:     data="{{vm.availabilityDataPoints}}"
      chart-type="availability">
  </availability-chart>
  ----
  The availability chart makes it easy to visualize the availability types:
  
  