39 lines
1.5 KiB
PHP
39 lines
1.5 KiB
PHP
|
<div class="container">
|
||
|
|
<h2>Summary for Form <?php echo $form_id; ?></h2>
|
||
|
|
<?php foreach ($data as $question => $info) : ?>
|
||
|
|
<div class="chart-container">
|
||
|
|
<h3><?php echo $question; ?></h3>
|
||
|
|
<canvas id="chart-<?php echo md5($question); ?>" width="400" height="400"></canvas>
|
||
|
|
</div>
|
||
|
|
<script>
|
||
|
|
var ctx = document.getElementById('chart-<?php echo md5($question); ?>').getContext('2d');
|
||
|
|
var labels = <?php echo json_encode(array_unique($info['answers'])); ?>;
|
||
|
|
var counts = labels.map(label => {
|
||
|
|
return <?php echo json_encode(array_count_values($info['answers'])); ?>[label];
|
||
|
|
});
|
||
|
|
|
||
|
|
var chartData = {
|
||
|
|
labels: labels,
|
||
|
|
datasets: [{
|
||
|
|
data: counts,
|
||
|
|
backgroundColor: labels.map(() => 'rgba(54, 162, 235, 0.2)'),
|
||
|
|
borderColor: labels.map(() => 'rgba(54, 162, 235, 1)'),
|
||
|
|
borderWidth: 1
|
||
|
|
}]
|
||
|
|
};
|
||
|
|
|
||
|
|
var chartType = '<?php echo ($info['type'] == 'checkbox') ? 'bar' : 'pie'; ?>';
|
||
|
|
new Chart(ctx, {
|
||
|
|
type: chartType,
|
||
|
|
data: chartData,
|
||
|
|
options: {
|
||
|
|
responsive: true,
|
||
|
|
maintainAspectRatio: false
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
<?php endforeach; ?>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|