mutual_credit-5.0.x-dev/templates/mcapi-timeline.html.twig

{#
/**
 * @file
 * Default theme implementation to display a wallet's balance history. Variables:
 * id
 * title
 * width
 * height
 * currency
 * points
 * daterows an array of arrays containing, m/d/Y date, value, and formatted value
 * vaxislabels # array of labels keyed by value
 * zeroline
 *
#}
{{ attach_library('mcapi/mcapi.gcharts') }}
<script>
google.charts.setOnLoadCallback({{ id }});
function {{ id }}() {
  var data = new google.visualization.arrayToDataTable([
    [{{'Date'|t }}, "value"],
    {% for date, val in daterows %}
    [new Date('{{ date }}'), {{ val }}],
    {% endfor %}
  ]);
  var options = {
    title: "{{ title }}",
    width: {{ width }},
    height: {{ height }},
    legend: {position: 'none'},
    vAxis: {
      ticks: [
    {% for tick in vaxislabels %}
    {v:"{{ tick.value }}", f:"{{ tick.label }}"},
     {% endfor %}]
    }
  }
  new google.visualization.LineChart(document.getElementById('{{ id }}')).draw(data, options);
}
</script>

<div id="{{ id }}" class = "mcapi-timeline" style="width:{{ width }}px; height:{{ height }}px;"></div>