['hygiene', 'anthropocene', 'urban gardening', 'real world', 'love']
Necessito una funció en JavaScript que generi un gràfic de barres amb D3.js mostrant l'evolució de la producció d'aliments ecològics a Catalunya en els darrers 5 anys. Les dades són: [2018, 100], [2019, 120], [2020, 150], [2021, 170], [2022, 200].
```javascript
function crearGrafic(dades) {
  const margin = { top: 20, right: 20, bottom: 30, left: 40 };
  const width = 960 - margin.left - margin.right;
  const height = 500 - margin.top - margin.bottom;

  const svg = d3.select("body").append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)
    .append("g")
    .attr("transform", `translate(${margin.left},${margin.top})`);

  const x = d3.scaleBand().range([0, width]).padding(0.1);
  const y = d3.scaleLinear().range([height, 0]);

  x.domain(dades.map(d => d[0]));
  y.domain([0, d3.max(dades, d => d[1])]);

  svg.selectAll(".bar")
    .data(dades)
    .enter().append("rect")
    .attr("class", "bar")
    .attr("x", d => x(d[0]))
    .attr("width", x.bandwidth())
    .attr("y", d => y(d[1]))
    .attr("height", d => height - y(d[1]));

  svg.append("g")
    .attr("transform", `translate(0,${height})`)
    .call(d3.axisBottom(x));

  svg.append("g")
    .call(d3.axisLeft(y));
}

const dades = [[2018, 100], [2019, 120], [2020, 150], [2021, 170], [2022, 200]];

crearGrafic(dades);
```