bhylu.com

Advertisements

JS Chart.js

Chart.js draws charts on a canvas. Load its documented bundle or register the required components in a local module project.

Where to run this

Use a local browser project for this example. It needs browser permissions, additional files, a server endpoint, or a library as described below. The restricted playground cannot provide those dependencies.

A practical example

JavaScript

// HTML: <canvas id="chart" aria-label="Repair 8, Wood 5" role="img"></canvas>
// Load the Chart.js auto bundle before this code.
new Chart(document.getElementById("chart"), {
  type: "bar",
  data: {labels: ["Repair", "Wood"], datasets: [{label: "Bookings", data: [8, 5]}]}
});

What happens

A configured local project shows the booking counts as bars.