Data Visualisation - lesson 3 | HackIndia Skills

Data Visualisation - lesson 3 | HackIndia Skills | HackIndia

Example

Small change, fair view

Your app has weekly active users: 92, 96, 101, 105. A y-axis from 90 to 106 makes growth look steep. That may be okay for a line chart if the axis labels are clear, but not for a bar chart.

Here is a safe Chart.js bar chart setup. The y-axis starts at zero and labels the unit.

const chartConfig = {
  type: 'bar',
  data: {
    labels: ['Week 1', 'Week 2', 'Week 3', 'Week 4'],
    datasets: [{
      label: 'Active users',
      data: [92, 96, 101, 105],
      backgroundColor: '#2563eb'
    }]
  },
  options: {
    scales: {
      y: {
        beginAtZero: true,
        title: {
          display: true,
          text: 'Active users'
        }
      },
      x: {
        title: {
          display: true,
          text: 'Week'
        }
      }
    }
  }
};

Tip

Ask AI to audit

Paste your chart config or screenshot into ChatGPT, Gemini, or Claude and ask for an axis honesty check.

Check the answer yourself. AI may miss the chart type, unit, or whether a zoomed axis is explained.

Prompt:
Review this dashboard chart for honest axes and scales.
Tell me if the y-axis should start at zero, whether the units are clear, and whether the scale could mislead a recruiter or hackathon judge.

Use honest axes and scales

The honest axis rule

Why axes matter

Choose the scale

Common axis tricks

Small change, fair view

Ask AI to audit

Axis checklist

Do this now

Quick check