<div style="width:100%;text-align:center;">
  <div id="{{id}}" style="width:92%;height:0;padding-bottom:60%;margin:auto;"></div>
{{#if subtext}}
  <p>{{title}} - {{subtext}}</p>
{{else}}  
  <p>{{title}}</p>
{{/if}}
  <p></p>
</div>
<script type="text/javascript">
  var option = {
    legend: {
      data: [
{{#each legenddata}}      
        '{{this}}',
{{/each}}          
      ],
    },    
    xAxis: {
        type: '{{xtype}}',
        silent: false,
        splitLine: {
            show: false
        },
{{#if xshowall}}        
        axisLabel: {
          interval:0
        },
{{/if}}
        data: adadata_{{datasetname}}.{{xdata}}
    },
    yAxis: {
        type: '{{ytype}}'
    },
    series: [
{{#each ydata}}
    {
        name: '{{{this.name}}}',
        data: adadata_{{../datasetname}}.{{{this.data}}},
        type: 'bar',
        areaStyle: {}
    },
{{/each}}    
    ]
  };

  var chart_{{ id }} = adarender.initChart(document.getElementById('{{id}}'), option);
</script>