Presenting PHP Data with JavaScript Charts

PHP can query and process database data, then pass a small prepared result to JavaScript for presentation.

<?php
$labels = array_column($rows, "team_name");
$points = array_map("intval", array_column($rows, "points"));
?>
<script>
const labels = <?= json_encode($labels) ?>;
const points = <?= json_encode($points) ?>;
</script>

Use a chart library or your own display code with these arrays. Do not construct JavaScript by concatenating unescaped database text.

Preserve meaning

Include:

• descriptive chart title
• labels and units
• adequate contrast
• predictable category order
• a table or textual alternative
• an empty-data message

The chart should visualise a result that responds to a user need or success criterion. JavaScript is one presentation option, not the evidence by itself.

Check

• PHP output uses json_encode().
• Data is already filtered or aggregated appropriately.
• Chart has a non-visual alternative.
• Empty and extreme values are tested.
• Script errors do not hide all useful output.