Charts - Sparkline

<ins-sparkline id="sparkLineChartID" icon="icon-analytic-1" name="Profits" value="370"
percentage="26" description="From previous year" movement="0">

<script>
  var data = [
    ["2017-12-18", 13],
    ["2017-12-25", 0],
    ["2018-01-01", 6],
    ["2018-01-08", 8],
    ["2018-03-12", 4],
    ["2018-06-01", 2],
    ["2018-08-08", 0]
  ]

  var sparklineChartEl = document.getElementById('sparkLineChartID');
  sparklineChartEl.addEventListener('didLoad', function(e){
    sparklineChartEl.chartData = data;
  });
</script>

<ins-sparkline></ins-sparkline>

<ins-sparkline id="directDataSourceSpark"
    name="Direct Data Source"
    icon="icon-user-1"
    value="720"
    percentage="7"
    description="From previous year"
    movement="1">
  </ins-sparkline>

  <script>
    var data = [
      ["2017-12-18", 13],
      ["2017-12-25", 0],
      ["2018-01-01", 0],
      ["2018-01-08", 8]
    ]

    var directDataSourceSpark = document.getElementById('directDataSourceSpark');
    directDataSourceSpark.addEventListener('didLoad', function(e){
      directDataSourceSpark.chartData = data;
    });

  </script>

<ins-sparkline
  id="staticDataSource"
  icon="icon-analytic-1"
  name="Static Data Source"
  value="720"
  percentage="7"
  description="From previous year"
  movement="increase">
</ins-sparkline>

<script>
  var data = [
    ["2017-12-18", 13],
    ["2017-12-25", 0],
    ["2018-01-01", 0],
    ["2018-01-08", 8]
  ]

  var staticDataSource = document.getElementById('staticDataSource');
  staticDataSource.addEventListener('didLoad', function(e){
    staticDataSource.chartData = data;
  });
</script>

<ins-sparkline
  data-src="https://8podbzvdw2.execute-api.us-east-2.amazonaws.com/insites-dummy-sparkline-deployment/insites-dummy-get-sparkline">
</ins-sparkline>