<?php

	$tags = mysql_select('tags', "TRUE ORDER BY count DESC LIMIT 50", "`name` as tag, IFNULL(`count`, 0) as count");

	$data = [];
	foreach($tags as $key => $tag){
		$data[$key]['tag'] = $tag['tag'];
		$data[$key]['count'] = $tag['count'];
	}
	// return json_encode($tagsData);
?>
<!-- Styles -->
<style>
#chartdiv {
  width: 100%;
  height: 400px;
}
</style>



<!-- HTML -->
<div id="chartdiv"></div>
<script>
	// Themes begin
am4core.useTheme(am4themes_animated);
// Themes end

var chart = am4core.create("chartdiv", am4plugins_wordCloud.WordCloud);

var series = chart.series.push(new am4plugins_wordCloud.WordCloudSeries());
series.randomness = 0.1;
series.rotationThreshold = 0.5;

series.data = <?php echo json_encode($data); ?>;

series.dataFields.word = "tag";
series.dataFields.value = "count";

series.heatRules.push({
 "target": series.labels.template,
 "property": "fill",
 "min": am4core.color("#0000CC"),
 "max": am4core.color("#CC00CC"),
 "dataField": "value"
});
series.labels.template.tooltipText = "{word}: {value}";
var hoverState = series.labels.template.states.create("hover");
hoverState.properties.fill = am4core.color("#FF0000");

</script>